ホームページ  >  記事  >  ウェブフロントエンド  >  Vue が次の表に従って配列を変更するとページがレンダリングされない問題を解決します

Vue が次の表に従って配列を変更するとページがレンダリングされない問題を解決します

亚连
亚连オリジナル
2018-05-31 16:38:291771ブラウズ

次に、Vue が次の表に従って配列を変更するとページがレンダリングされない問題を解決する記事を共有します。非常に良い参考値となっておりますので、皆様のお役に立てれば幸いです。

Vue がモデル状態の変化を監視できる理由は、JavaScript 言語自体がオブジェクト状態の変化を監視するための Proxy または Object.observe() メカニズムを提供しているためであることに注意してください。ただし、配列要素の割り当てを直接監視する方法はありません。そのため、配列要素に値を直接割り当てると、

vm.todos[0] = {
  name: 'New name',
  description: 'New description'
};

によって Vue がビューを更新できなくなります。

正しい方法は、配列要素に値を割り当てることではなく、更新することです:

vm.todos[0].name = 'New name';
vm.todos[0].description = 'New description';

または、要素を削除した後、splice() メソッドを通じて別の要素を追加して、「」の効果を実現します。 assign":

var index = 0;
var newElement = {...};
vm.todos.splice(index, 1, newElement);

Vue は、配列のスプライス、プッシュ、シフト解除、その他のメソッド呼び出しを監視できるため、上記のコードはビューを正しく更新できます。

上記は私が皆さんのためにまとめたもので、将来的に皆さんのお役に立てれば幸いです。

関連記事:

use を使用して Vue グローバル コンポーネントとグローバル命令を登録する方法

vue.js が CSS ライブラリ (elementUi) をインポートする方法について簡単に説明します

JS コードを使用して QR コードと関数を生成する (詳細なチュートリアル)

以上がVue が次の表に従って配列を変更するとページがレンダリングされない問題を解決しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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