vue中computed和watch的区别

两者都是监听数据，都是当依赖的数据发生改变时，被依赖的数据就自动发生改变

区别：
1.computed是监听多个数据，一搬用于计算一些复杂的场景，如购物车计算价格，即多对一，多个数据中的一个改变会引起汇总那个数据的改变；watch是监听一个数据，通过观察一个数据的变化去改变其他数据，如搜索框列表

2.computed用于计算，watch用于观察

3.computed一定要有return

4.computed具有缓存性，当依赖的数据没有发生变化时，就会从缓存中取出数据，所以computed的性能比watch要好一点

5.watch一般用来进行异步或者开销较大的操作

Computed

刚开始

点击改firstName:

点击改lastName:

Watch

输入小红后：

然后再复习一下watch的用法

vue中watch的handler，deep，immediate用法

handler

我们平时的写法，就默认写的是handler，vue.js会处理这个逻辑，最终编译出来就是这个handler
这两种写法一样，推荐第一种

immediate

该值默认是false，在进入页面时，第一次绑定值，不会立刻执行监听，只有数据发生改变才会执行handler中的操作；若是true，则在一开始就进行了监听

deep

vue是不能检测到对象属性的添加或删除，我们使用watch监听一个对象时，除非是直接重新给对象赋值，否则是不能监听到对象里的值的变化的

deep就是用来进行深度监听的！

参考链接：https://blog.csdn.net/qq_42975998/article/details/104485326?spm=1001.2014.3001.5501