vue.js での Watch の使用法を深く理解する

この記事の内容は、vue.js の watch の使用法についての深い理解を共有することです。必要な友人は参考にしてください。

見てください。 Vue インスタンス上のデータの変更、対応するオブジェクト、

key: は監視する必要があるもの、

value:

1。1 つ目は 2 つのパラメーターです。 1 つ目は変更前の値、2 つ目は変更後の値です。

2. 関数名を指定することもできますが、単一引用符で囲む必要があります。

3. このオブジェクトには 3 つのオプションがあります:
(1) ハンドラー: コールバック関数、変更が検出されたときに実行される関数。
(2) deep: ブール値、深く監視するかどうか。 (通常、オブジェクトの属性値の変更はモニタリング中に聞くことができませんが、配列の変更は聞くことができます)
(3) Immediate: ブール値、ハンドラー関数を即時に実行するかどうか。种watchの3つのケース:

1. 通常のwatch:

    el:'#app',
    data:{
        meter:1000,
        kilameter:1
    },
    watch:{
        meter:function(val){
            this.kilameter = val * 0.1;
        },
        kilameter:function(val){
            this.meter = val *1000;
        }
    }
})

E

2. 配列のwatch:

    el:'#app',
    data:{
        arr:[1,2,3]
    },
    watch:{
        arr:function(oldV,newV){
            console.log(oldV);
            console.log(newV);      
        }
    }
})

3. Explorationでのwatchの使い方

VueJsの$watch()メソッドまとめ！ !

以上がvue.js での Watch の使用法を深く理解するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。