vue watch

Question

computed: {
　　            TrafModeObj() {
　　　　             return this.customForm.TrafModeObj
　　            }
      },
      watch:{
        TrafModeObj(newValue, oldValue) {
          debugger
          console.log(chkTrafModeObj())
　　　　               //chkTrafModeObj()  
　　                },
        deep: true
      }

vue watch 如何监听一个对象的某个属性没有变化？我想在newValue === oldValue ===""的时候去校验input，让输入框不能为空.

Answer 1

watch只有当数据发生变化时才监听到，你想实现这种功能，可以换一种方式，比如存储初始值，在input中触发change或者blur事件，在事件中将值与初始值进行比对。

Answer 2

只是对对象属性监听 直接监听对象变化也可以 然后deep：true 深度观察 可以理解为监听内部属性的变化

而如果具体某个属性 你没必要深度监听 直接computed return 这个属性值 监听他的变化就可以了

你这个写法写重了把

Answer 3

你这个需求很奇怪，watch就是在数据进行变化的时候调用的，如果你提到的这个输入框不能为空的需求的话我推荐你可以用 自定义指令 来实现自定义指令

Vue.directive('isNull', {
  update: function (el,binding) {
      el.style.border= '';
      if((el.value=='')){
          el.style.borderColor= '#FF0000';
      }
  }
})