vue监听对象中的一个属性
时间: 2023-07-16 11:16:47 浏览: 93
vue watch关于对象内的属性监听
5星 · 资源好评率100%
在 Vue 中,你可以使用 `$watch` 方法来监听对象中的一个属性,具体步骤如下:
1. 在 Vue 实例中定义一个对象,例如 `data` 属性中的 `user` 对象。
2. 使用 `$watch` 方法来监听 `user` 对象中的某个属性,例如 `user.name`。
3. 在 `$watch` 方法中定义回调函数,当被监听的属性发生变化时,回调函数会被调用。
示例代码如下:
```javascript
new Vue({
el: '#app',
data: {
user: {
name: 'John',
age: 30
}
},
mounted: function() {
this.$watch('user.name', function(newValue, oldValue) {
console.log('user.name changed from ' + oldValue + ' to ' + newValue);
});
}
});
```
在上面的示例中,我们监听了 `user.name` 属性的变化,并在回调函数中输出变化前后的值。你可以根据自己的需求在回调函数中执行任何操作。
阅读全文