Vue面试之watch与computed的区别

最近在整理一些前端面试中经常被问到的问题，分为vue相关、react相关、js相关、react相关等等专题，可持续关注后续内容，会不断进行整理~

watch与computed作为Vue中两个处理响应式数据的选项，都用来监听数据变化并执行相应的逻辑，在具体使用时会存在区别：

watch

watch用于监听指定的数据变化并执行相应的回调函数，它有两种写法：

对象形式

watch: {
   
    shops: {
   
      handler(oldValue, newValue) {
   
        // 写一些逻辑，当shops参数发生变化时就会执行
      }
    },
    visible: {
   
      handler(oldValue, newValue) {
   
        // 写一些逻辑，当visible参数发生变化时就会执行
      }
    }
  },

当需要设置深层监视时（如要监视一个对象时），则需要开启deep属性：

watch: {
   
    shops: {