vue watch監聽新增屬性

最近使用vue的watch功能監聽Object的屬性變化，發現一個問題：通過直接賦值的方法為Object新增屬性時，watch監聽不到變化

監聽方法

watch: {
     queryForm: {
           handler (value) {
               console.log(value)
           },
           deep: true
     }
 }

新增屬性id

methods: {
  fun1 () {
     this.queryForms['id'] = 2
  }
}

這種方法新增了id屬性，watch是無法監聽到變化的。

解決方法

methods: {
  fun1 () {
     this.$set(this.queryForms, 'id', '2')
  }
}

此方法賦值可以監聽到變化。

備注：不僅新增屬性，原有屬性變化時也可以使用this.$set（）方法