Vue 中 methods,computed, watch 的区别

Vue 中 methods,computed, watch 的区别

Methods

methods 中都是封装好的函数，无论是否有变化只要触发就会执行

适用场景：组件中功能的封装，逻辑处理

Computed

computed: 是 vue 独有的特性计算属性，可以对 data 中的依赖项再重新计算得到一个新值，应用到视图中，和 methods 本质区别是 computed 是可缓存的， 也就是说 computed 中的依赖项没有变化，则 computed 中的值就不会重新计算， 而 methods 中的函数是没有缓存的。

适用场景：假设我们有一个性能开销比较大的计算属性 A，它需要遍历一
个巨大的数组并做大量的计算。然后我们可能有其他的计算属性依赖于A 。如果没有缓存，我们将不可避免的多次执行某个函数

Watch

watch 是监听 data 和计算属性中的新旧变化

适用场景：当需要在数据变化时执行“异步”或“开销较大”的操作时，这个方式是最有用的