vue watch監(jiān)聽對象

VioletJack 發(fā)布于2019-08-26 13:47 / 2298人閱讀

摘要：下面說下在項目中遇到的監(jiān)聽對象的問題。問題在監(jiān)聽對象時，監(jiān)聽不到子屬性的變化。解決方法新增一個關于對象的計算屬性，切將對象轉換成字符串。

在vue項目中，我們經常會用到監(jiān)聽watch。下面說下在項目中遇到的監(jiān)聽對象的問題。
問題：

在監(jiān)聽對象時，監(jiān)聽不到子屬性的變化。

解決方法：

新增一個關于對象的計算屬性，切將對象轉換成字符串。

監(jiān)聽此計算屬性

代碼示例：

watch: {
    pluginsDataChange (newval, oldval) {
        this.num++
    }
},
computed: {
    pluginsDataChange () {
        return JSON.stringify(this.pluginsData)
    }
},

云服務器 GPU云服務器 javascript監(jiān)聽對象 watching watche watch

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉載請注明本文地址：http://systransis.cn/yun/109518.html

【Vue原理】Watch - 白話版

摘要：而是在初始化時，在讀取了監(jiān)聽的數(shù)據的值之后，便立即調用一遍你設置的監(jiān)聽回調，然后傳入剛讀取的值設置了時，如何工作我們都知道有一個選項，是用來深度監(jiān)聽的。寫文章不容易，點個贊唄兄弟專注 Vue 源碼分享，文章分為白話版和源碼版，白話版助于理解工作原理，源碼版助于了解內部詳情，讓我們一起學習吧研究基于 Vue版本【2.5.17】如果你覺得排版難看，請點擊下面鏈接或者拉到下...

hzx 2019-08-23 18:25 評論0 收藏0
【Vue原理】Watch - 源碼版

摘要：寫文章不容易，點個贊唄兄弟專注源碼分享，文章分為白話版和源碼版，白話版助于理解工作原理，源碼版助于了解內部詳情，讓我們一起學習吧研究基于版本如果你覺得排版難看，請點擊下面鏈接或者拉到下面關注公眾號也可以吧原理源碼版今天繼續(xù)探索源碼，廢話不寫文章不容易，點個贊唄兄弟專注 Vue 源碼分享，文章分為白話版和源碼版，白話版助于理解工作原理，源碼版助于了解內部詳情，讓我們一起學習吧研究基于...

Hancock_Xu 2019-08-23 18:32 評論0 收藏0
針對vue wtach一次詳細的剖析

摘要：提問深度與非深度的區(qū)別對象與數(shù)組與的區(qū)別的一個特點是，最初綁定的時候是不會執(zhí)行的，要等到改變時才執(zhí)行監(jiān)聽計算。為一個對象，鍵是需要觀察的表達式，值是對應回調函數(shù)。值也可以是方法名，或者包含選項的對象適用場景一個數(shù)據影響多個數(shù)據。提問 1.深度watch與非深度watch的區(qū)別；2.watch對象與數(shù)組；3.watch與computed的區(qū)別； immediate FullNa...

crossoverJie 2019-08-23 18:05 評論0 收藏0
Vue的computed和watch的細節(jié)全面分析

摘要：定義是一個計算屬性類似于過濾器對綁定到的數(shù)據進行處理用法不可在里面定義如果定義會報如下圖片的錯誤因為對應的作為計算屬性定義并返回對應的結果給這個變量變量不可被重復定義和賦值和用法回調函數(shù)當需要讀取當前屬性值是執(zhí)行，根據相關數(shù)據計算并返回當前 1.computed 1.1 定義是一個計算屬性,類似于過濾器,對綁定到view的數(shù)據進行處理 1.2 get用法 data: { ...

lastSeries 2019-08-01 18:25 評論0 收藏0
Vue的computed和watch的細節(jié)全面分析

摘要：定義是一個計算屬性類似于過濾器對綁定到的數(shù)據進行處理用法不可在里面定義如果定義會報如下圖片的錯誤因為對應的作為計算屬性定義并返回對應的結果給這個變量變量不可被重復定義和賦值和用法回調函數(shù)當需要讀取當前屬性值是執(zhí)行，根據相關數(shù)據計算并返回當前 1.computed 1.1 定義是一個計算屬性,類似于過濾器,對綁定到view的數(shù)據進行處理 1.2 get用法 data: { ...

CoderDock 2019-08-22 13:58 評論0 收藏0
Vue中watch對象內屬性的方法

摘要：通常寫法是，上述情況里中的屬性可以直接監(jiān)聽，但是如果需要監(jiān)聽的數(shù)據是對象內的某一屬性值的變化，直接對象是檢測不到變化的，這是因為這個對象的指向并沒有發(fā)生改變。不過這樣會造成更多的性能開銷，尤其是對象里面屬性過多，結構嵌套過深的時候。 vue提供了watch方法，用于監(jiān)聽實例內data數(shù)據的變化。通常寫法是： new Vue({ data: { count: 10， ...

OldPanda 2019-08-23 15:05 評論0 收藏0