watch监听Vue.prototype的变化
时间: 2023-06-12 19:07:27 浏览: 240
vue watch监听对象及对应值的变化详解
5星 · 资源好评率100%
如果你想在`Vue.prototype`的属性发生变化时执行一些操作,可以使用Vue的`$watch`方法来监听。你可以在Vue实例创建之前,在全局中使用`Vue.prototype`来定义属性,然后使用`$watch`来监听这些属性的变化。
以下是一个简单的示例代码:
```javascript
Vue.prototype.$myProp = 'foo'; // 定义一个全局属性
new Vue({
el: '#app',
created() {
// 监听$myProp属性的变化
this.$watch('$myProp', (newValue, oldValue) => {
console.log(`$myProp 的值从 ${oldValue} 变为 ${newValue}`);
});
}
});
```
在上面的代码中,我们定义了一个全局属性`$myProp`,然后在Vue实例的`created`钩子函数中使用`$watch`来监听它的变化。当`$myProp`的值发生变化时,回调函数就会执行,并打印出变化前后的值。
需要注意的是,如果你想监听一个对象或数组的属性变化,需要使用Vue的深度监听选项`{deep: true}`,否则只能监听到对象或数组的引用变化,而无法监听到内部属性的变化。
阅读全文