美文网首页
computed与watch的区别

computed与watch的区别

作者: 杭州程序员小陈 | 来源:发表于2021-07-12 09:54 被阅读0次

    computed
    omputed 是计算属性,它会根据你所依赖的数据动态显示新的计算结果
    计算属性将被加入到 Vue 实例中。所有 getter 和 setter 的 this 上下文自动地绑定为 Vue 实例
    通过计算出来的属性不需要调用直接可以在 DOM 里使用
    watch
    一个对象,键是 data 对应的数据,值是对应的回调函数。值也可以是方法名,或者包含选项的对象,当 data 的数据发生变化时,就会发生一个回调,他有两个参数,一个 val (修改后的 data 数据),一个 oldVal(原来的 data 数据)
    Vue 实例将会在实例化时调用$watch(),遍历 watch 对象的每一个属性
    区别
    计算属性 computed:
    (1)支持缓存,只有依赖数据发生变化时,才会重新进行计算函数;
    (2)计算属性内不支持异步操作;
    (3)计算属性的函数中都有一个 get(默认具有,获取计算属性)和 set(手动添加,设置计算属性)方法;
    (4)计算属性是自动监听依赖值的变化,从而动态返回内容。
    侦听属性 watch:
    (1) 不支持缓存,只要数据发生变化,就会执行侦听函数;
    (2) 侦听属性内支持异步操作;
    (3) 侦听属性的值可以是一个对象,接收 handler 回调,deep,immediate 三个属性;
    (3) 监听是一个过程,在监听的值变化时,可以触发一个回调,并做一些其他事情。
    用法
    如果一个数据需要经过复杂计算就用 computed
    如果一个数据需要被监听并且对数据做一些操作就用 watch

    相关文章

      网友评论

          本文标题:computed与watch的区别

          本文链接:https://www.haomeiwen.com/subject/vsrrpltx.html