vue中computed与watch/methods的区别

124 阅读1分钟

computed和watch的区别 :

  • 功能上 : computed是计算属性,内部函数在调用时不加( ) , watch是监听一个值的变化,然后执行对应的回调 , 类似监听机制+事件机制

  • 是否调用缓存 : computed中的函数所依赖的属性没有发生变化,那么调用当前的函数的时候会从缓存中读取, 而watch在每次监听的值发生变化的时候都会执行回调

  • 是否调用return : computed函数中必须要用return返回 , watch中函数不是必须要用return

  • 使用场景 : 当一个数据受多个属性影响的时候,使用computed , 比如购物车结算 ; 当一条数据影响多条数据的时候 , 使用watch , 比如搜索框 .

computed和methods的区别 :

  • 调用方式不一样 : computed定义的成员像属性一样调用 , methods定义的成员必须以函数形式调用
  • computed带缓存 , 只有依赖的属性改变时候才会重新计算 , methods里的函数每次调用的时候都执行一遍 (假如定义的方法只调用一遍, 随便用哪个都行)
  • computed中的成员可以只定义一个函数作为只读属性,也可以定义get/set变成可读写属性,这点是methods中的成员做不到的

computed里不能对属性再赋值操作,属性改变会触发computed里的函数,会死循环