vue 监听表格里的数据变化_vue 中 深度监听数据变化

本文解决：

watch 与 computed 应该使用哪个；

watch中绑定object或array时，数据没有更新(deep)；

prop的默认值(default)没有触发watch函数(immediate)；

多个prop更新时触发同一个处理函数

watch 方法是什么

在Vue中，我们可以[监视属性何时更改]并对响执行一些操作。

例如，如果colour发生变化，我们console一些文字：

export default {

name: 'ColourChange',

props: ['colour'],

watch: {

colour()

console.log('The colour has changed!');

}

}

}

这些观察者使我们能够做各种有用的事情。

但是很多时候，我们本来只需要使用computed实际上却使用率watch。

应该使用watch还是computed？

watched通常会与computed属性混淆，因为它们的运作方式相似。知道何时使用哪一个更难。

但是我想出了一个很好的经验法则。

改变state使用computed，需要副作用使用watch。

任何异步或发生在component外的，都算是副作用

常见的例子有：

请求接口获取数据

操作DOM

使用浏览器API，例如local sto