uniapp 在created 中用$watch监听不到globalData中的属性改变
时间: 2024-02-13 14:02:47 浏览: 264
vue 子组件watch监听不到prop的解决
在uni-app中使用`$watch`监听`globalData`中的属性时,需要注意以下几点:
1. 确认`globalData`是否已经被挂载到了`uni`对象上,可以通过`uni.$globalData`来访问。
2. 确认`globalData`中的属性是否已经被初始化,如果没有初始化,那么`$watch`是无法监听到属性的变化的。
3. 在`created`中使用`$watch`需要注意,`$watch`是在组件实例创建之后才会被调用,也就是说,在`created`中使用`$watch`时,需要先将`globalData`中的属性赋值给组件实例中的一个变量,然后再使用`$watch`监听这个变量的变化。
以下是一个示例代码:
```javascript
export default {
created() {
const globalDataProp = uni.$globalData.prop;
this.prop = globalDataProp; // 先将属性赋值给组件实例中的变量
this.$watch('prop', (newValue, oldValue) => {
console.log('globalData.prop has changed');
});
}
}
```
需要注意的是,uni-app中使用`$watch`时,需要在`this.$nextTick()`中使用`$watch`,以确保组件已经渲染完毕。例如:
```javascript
export default {
created() {
this.$nextTick(() => {
const globalDataProp = uni.$globalData.prop;
this.prop = globalDataProp; // 先将属性赋值给组件实例中的变量
this.$watch('prop', (newValue, oldValue) => {
console.log('globalData.prop has changed');
});
});
}
}
```
阅读全文