【vue笔记】vue中的watchEffect函数

小付学代码

已于 2022-08-17 09:36:35 修改

阅读量924

点赞数 1

分类专栏： vue 文章标签： vue.js javascript 前端

于 2022-07-11 18:08:37 首次发布

本文链接：https://blog.csdn.net/ONLYSRY/article/details/125727108

版权

vue 专栏收录该内容

35 篇文章 0 订阅

订阅专栏

本文详细解析了Vue中watch和watchEffect的使用区别。watchEffect自动监测回调中引用的所有属性变化，而watch需要手动指定监听的属性。watchEffect注重执行过程，不需返回值，而computed更关注计算后的值，需要返回结果。当回调中的数据变化时，watchEffect会立即重新执行。

摘要由CSDN通过智能技术生成

- watch的套路是：既要指明监视的属性，也要指明监视的回调。

- watchEffect的套路是：不用指明监视哪个属性，监视的回调中用到哪个属性，那就监视哪个属性。

- watchEffect有点像computed：

- 但computed注重的计算出来的值（回调函数的返回值），所以必须要写返回值。

- 而watchEffect更注重的是过程（回调函数的函数体），所以不用写返回值。

  //watchEffect所指定的回调中用到的数据只要发生变化，则直接重新执行回调。

  watchEffect(()=>{

      const x1 = sum.value

      const x2 = person.age

      console.log('watchEffect配置的回调执行了')

  })