vue中watch監(jiān)聽值或者form對象以及路由的變化

var vm=new Vue({

? ? data:{

? ? ? ? a:1,

? ? ? ? b:{

? ? ? ? ? ? c:1? ? ? ? }

? ? },

? ? watch:{

? ? ? ? a(val, oldVal){//普通的watch監(jiān)聽? ? ? ? ? ? console.log("a: "+val, oldVal);

? ? ? ? },

? ? ? ? b:{//深度監(jiān)聽,可監(jiān)聽到對象、數(shù)組的變化? ? ? ? ? ? handler(val, oldVal){

? ? ? ? ? ? ? ? console.log("b.c: "+val.c, oldVal.c);//但是這兩個值打印出來卻都是一樣的? ? ? ? ? ? },

? ? ? ? ? ? deep:true? ? ? ? }

? ? }

})

vm.a=2

vm.b.c=2

a是一個普通的值,當a的值變化時會被監(jiān)聽到,b是一個對象,不能直接像a那么寫,需要深度監(jiān)聽才能捕捉到,但是當我想去捕捉b對象中某一個值的變化時卻發(fā)現(xiàn),打印出來的兩個值是不一樣的





這樣就只能知道對象發(fā)生變化卻不知道具體哪個值發(fā)生了變化,如果想監(jiān)聽對象某一個值得變化可以利用計算屬性computed

var vm=new Vue({

? ? data:{

? ? ? ? b:{

? ? ? ? ? ? c:1? ? ? ? }

? ? },

? ? watch:{

? ? ? ? newValue(val, oldVal){

? ? ? ? ? ? console.log("b.c: "+val, oldVal);

? ? ? ? }

? ? },

? ? computed: {

? ?   newValue() {

? ?     return this.b.c

? ?   }

? ? }

})

vm.b.c=2

用watch去監(jiān)聽computed計算過的值就可以直接知道是哪個對應(yīng)的值發(fā)生了變化



watch: { // 監(jiān)聽路由傳值變化,當頁面不重新加載的時候需要加載不同模型

? ? $route () {

? ? ? this.sceneName = this.$route.query.sceneName

? ? ? window.TTS.addObjectToScene(this.sceneName)

? ? }

? }

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容