vue, 终止"监听"属性

1,030 阅读1分钟

这样Vue.js才会一层一层解析下去,直到遇到属性a,然后才给a设置监听函数。

注销watch

为什么要注销 watch?因为我们的组件是经常要被销毁的,比如我们跳一个路由,从一个页面跳到另外一个页面,那么原来的页面的 watch 其实就没用了,这时候我们应该注销掉原来页面的 watch 的,不然的话可能会导致内置溢出。好在我们平时 watch 都是写在组件的选项中的,他会随着组件的销毁而销毁。

const app = new Vue({
 template: '<div id="root">{{text}}</div>',
 data: {
 text: 0
 },
 watch: {
 text(newVal, oldVal){
 console.log(`${newVal} : ${oldVal}`);
 }
 }
});

但是,如果我们使用下面这样的方式写 watch,那么就要手动注销了,这种注销其实也很简单

const unWatch = app.$watch('text', (newVal, oldVal) => {
 console.log(`${newVal} : ${oldVal}`);
})
unWatch(); // 手动注销watch

app.$watch调用后会返回一个值,就是unWatch方法,你要注销 watch 只要调用unWatch方法就可以了。