Vue中如何区分并正确运用watch和computed？

本文共计1828个文字，预计阅读时间需要8分钟。

`computed` 属性说明：`computed` 是基于响应性依赖进行缓存的。只有依赖数据发生变化时，`computed` 才会重新进行计算（即当依赖的数据发生改变时，才会重新进行计算）。如果依赖数据没有变化，`computed` 不会重新计算（即依赖数据未变，`computed` 保持不变）。

computed 计算属性说明:

computed 是基于响应性依赖来进行缓存的。只有依赖数据发生改变，才会重新进行计算（当触发重新渲染，若依赖数据没有改变，则 computed 不会重新计算）。若没改变，计算属性会立即返回之前缓存的计算结果。

不支持异步，当 computed 内有异步操作时无效，无法监听数据的变化的值。

computed 中的成员可以只定义一个函数作为只读属性, 也可以定义成 get/set 变成可读写属性

如果一个属性是由其他属性计算而来的，这个属性依赖其他属性，是一个多对一或者一对一，一般用 computed。

下面的计算属性将不再更新，因为 Date.now() 不是响应式依赖：

computed: { now: function () { return Date.now() } }

相比之下，每当触发重新渲染时，调用方法将总会再次执行函数。