vue2.0 -- watch監聽

時間 2019-11-16

標籤 vue2.0 vue watch 監聽简体版

原文原文鏈接

watch監聽的幾種寫法:html

<html>
<!--在這裏插入內容-->

    watch: {
        // 適用於普通變量
        a: function (val) {
            console.log(000)
        },
        // 方法名
        b: 'doing'
        //用handler方法
        c: {
            //當即執行,在c聲明以後就開始執行handler裏面的內容
            immediate: true,
            //深度監聽 監聽C的屬性 c.xxx
            deep: true,
            handler: function (val) 
            {0000000000000}
        }
    }
</html>

1.handler方法

在項目中,有時會用到handler方法,有時則不會用到vue

handler方法有什麼做用呢:編程

handler方法是 watch中的一個屬性,是函數類型是規定的寫法

2.immediate方法

watch監聽,是當對象發生變化時,纔回去監聽其變化.而immediate是在對象聲明瞭以後,就開始去監聽,watch裏面的handler方法就開始執行.

3.deep方法

Vue 不能監聽到對象屬性的添加和刪除, deep 就排上了用場,監聽器會一層一層的往下遍歷,給對象的全部屬性都加上這個監聽器,從而監聽到對象屬性的變化.

<html>
<!--在這裏插入內容-->

    data: {
        obj: {
            a:12
        }
    }
    
    watch: {
        'obj' : {
            handler(val) {
                console.log(val.a)
            },
            deep: true
        }
    }
</html>

可是,也有別的方法---->就是直接監聽obj的a屬性函數

<html>
<!--在這裏插入內容-->

    data: {
        obj: {
            a:12
        }
    }
    
    watch: {
        'obj.a' : {
            handler(val) {
                console.log(val.a)
            }
        }
    }
</html>

今天編程,所吃的虧 -.-this

watch 裏面不能使用 箭頭函數.

watch裏面的this指向的應該是vue的實例對象.

若是用了箭頭函數,則指向的是父級做用域的上下文.

1. vue.js watch監聽，vue.js 監聽watch
2. vue watch 監聽
3. $scope.$watch監聽
4. Vue watch監聽
5. Vue——監聽器watch
6. watch監聽變化
7. watch監聽對象
8. 監聽屬性watch:
9. watch 監聽屬性
10. vue watch 路由監聽屬性監聽
更多相關文章...
• Redis watch命令——監控事務 - Redis教程
• Redis發佈訂閱模式 - Redis教程
• RxJava操作符（六）Utility
• Java Agent入門實戰（一）-Instrumentation介紹與使用

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。