ウォッチ（リスニング属性）
例
cosnt app = new Vue({
//...
watch:{
要监听的属性:{
handler(新值，旧值){
//... }，
功能属性
}
}
})
ハンドラ
- ハンドラーメソッドは、monitoredプロパティにバインドされています。前に作成されたwatchメソッドは、デフォルトでこのハンドラーを実際に書き込みます。Vue
はこのロジックを処理し、最終的なコンパイルは実際にはこのハンドラーです。
デフォルト
- 監視は、最初にバインドされたときには実行されず、監視対象の属性が変更されるまで実行されません
機能属性
immediate:true
- 監視対象の属性がwacthで宣言されている場合、内部のハンドラーメソッドがすぐに実行され、デフォルトはfalseです。
deep：true
深度监听,默认false
- 監視対象オブジェクトがオブジェクトの場合、詳細な監視とは、オブジェクト内のすべての要素の変更を監視することです
- リスナーはレイヤーごとにトラバースし、このリスナーをオブジェクトのすべてのプロパティに追加するため、パフォーマンスのオーバーヘッドが非常に大きくなります。objの属性を変更すると、リスナーのハンドラーがトリガーされます
解決
把某一个要监听的对象元素用字符串包起来
watch:{
"对象名称.元素名称":{
//... }
}
時計からログアウト
- ウォッチがコンポーネント内に記述されていない場合、組み込みのオーバーフローが発生するため、手動でログアウトする必要があります
- コンポーネントの外側を見る
const 名称 = 组件名称.$watch('监听目标', (新值, 旧值) => {
//。。。 })
unWatch(); // 手动注销
手動でログアウト
- コンポーネント名。$ watchは、呼び出し後に値を返します。これは、unWatchメソッドです。監視をログオフする場合は、unWatchメソッドを呼び出します。