ホームページ  >  記事  >  ウェブフロントエンド  >  Vue でオブジェクトのプロパティが変更されたときにビューが更新されない問題に対処するにはどうすればよいですか?

Vue でオブジェクトのプロパティが変更されたときにビューが更新されない問題に対処するにはどうすればよいですか?

亚连
亚连オリジナル
2018-06-05 13:45:502779ブラウズ

以下に、Vue でオブジェクトのプロパティが変更されたときにビューが更新されない問題を解決する記事を共有します。これは非常に参考になるので、皆さんのお役に立てれば幸いです。

通常はvueインスタンスのデータにレスポンスデータを設定します。しかし、データがオブジェクトであり、オブジェクトの属性値を追加または削除すると、ビューは更新をトリガーしません。この問題を解決するにはどうすればよいでしょうか。

コード例は次のとおりです:

let vm = new Vue{
 el: '#app',
 data: {
  obj: {
    k: 'v'
  }
 },
 ...
}

解決策は 3 つあります:

オプション 1: Vue.set(object,key,val) を使用します

例: Vue .set( vm.obj,'k1','v1')

オプション 2:this.$set(this.obj,key,val) を使用します

例: this.$set(this.obj ,'k1 ', 'v1')

オプション 3: Object.assign({}, this.obj) を使用して新しいオブジェクトを作成します

例:

 this.obj.k1='v1';
 this.obj = Object.assign({}, this.obj)

または

this.obj = Object.assign({}, this.obj,{'k1','v1'})

以上が私がまとめたものです、皆さん、今後の参考になれば幸いです。

関連記事:

angularJs のテーブルを使用してクエリ メソッドを追加、削除、変更する方法

ExtJs を使用して Echarts を統合する方法 (詳細なチュートリアル)

angularJS で div メソッドを動的に追加および削除する方法

以上がVue でオブジェクトのプロパティが変更されたときにビューが更新されない問題に対処するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。