vue watchリスニングの新規プロパティ

635 ワード

最近、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()メソッド