watch 监听对象几种方式

1.监听下拉窗数据

templat创建输入框

script的watch中实现输入框监听

 watch: {
    'conditionForm.operator': {
      deep: true,
//newVal是检查你输入的新值，oldVal是检查你输入的老值
      handler(newVal, oldVal) {
        if (newVal === '5' || newVal === '6') {
          this.dishow = false
          this.rules.value = []
          this.conditionForm.value = ''
        } else {
          this.dishow = true
          this.rules.value = [
            ruler.required(this.$t('orderCenMsg.valueIsNull'), 'change'),
            ruler.commonWord(this.$t('orderCenMsg.conditionValueDataError'))
          ]
        }
      }
    }
  },

2.watch 监听对象几种方式

第一种：

使用 Vue 中的 watch 方法监听对象，设置 deep:true 可以进行深度监听，当对象中的属性发生变化时，会调用 handler 方法。

handler 会有两个参数第一个参数是新值，第二个参数是老值。

   

第二种：

如果需要只监听对象中某一属性的变化，watch 也能实现，另外也可以结合使用计算属性 computed 来对此进行监听。

第三种：

以下是结合计算属性对某一对象的单一属性实现监听的方法：

3.style中布局（省略代码）

……

`````````````````````````````````````````````````````````````````````````````````````````````

vue页面的构成:

一个vue页面主要包括3个部分：

1.

2.

3.

重点部分是业务实现