$set- und Array-Update-Methoden in vue.js_vue.js

Jetzt werde ich mit Ihnen einen Artikel über $set- und Array-Aktualisierungsmethoden in vue.js teilen. Er hat einen guten Referenzwert und ich hoffe, dass er für alle hilfreich sein wird.

Aufgrund von JavaScript-Einschränkungen kann Vue die folgenden geänderten Arrays nicht erkennen:

Wenn Sie einen Index verwenden, um ein Element des Arrays direkt festzulegen, zum Beispiel: vm.items[indexOfItem] = newValue

Wenn Sie die Länge des Arrays ändern, zum Beispiel: vm.items.length = newLength, wird das Array nicht aktualisiert.

Natürlich gibt es in Vue eine Lösung, die darin besteht, Vue.set, vm.$set (eine Variante von Vue.set) oder Splice, Caoncat usw. zu verwenden, um das Array zu ändern löst auch eine Statusaktualisierung aus:

Beispiel:

Wenn Sie also der Instanz neue Eigenschaften hinzufügen Nachdem die Instanz erstellt wurde, wird keine Erneuerung ausgelöst.

ps: Jetzt gibt es zwei Arrays, arr1 und arr2, wenn arr1 das Array durch Zuweisen eines Indexwerts ändert und arr2 das Array mit $set ändert, Was ist das Ergebnis?

data:{
 arr1 = ['a','b','c'];
 arr2 = [‘foo','bar','baz'];  
}

vm.arr1[1] = 'alpha';
vm.$set(vm.arr2, 1, 'alpha');

Nach dem, was wir zu Beginn gesagt haben, dass eine Änderung des Arrays basierend auf dem Indexindex keine Statusaktualisierung auslösen kann, wissen wir Folgendes: Die zweite Änderung des ersten Arrays wird nicht auf der Seite aktualisiert. Nur die Änderung des zweiten Arrays wird auf der Seite aktualisiert. Das Ergebnis ist jedoch:

arr1 = ['a', 'alpha', 'b', 'c'];
arr2 = [‘foo', 'alpha', 'bar','baz'];

Die Werte beider Arrays werden aktualisiert. Mit anderen Worten, wenn arr2 mit der Methode $set() aktualisiert wird, wird die Seite vollständig aktualisiert.

Ich habe das Obige für Sie zusammengestellt und hoffe, dass es Ihnen in Zukunft hilfreich sein wird.

Verwandte Artikel:

JQuery-Methode für ausgewählte Werte der ausgewählten Komponente

Codeaufteilungsmethode in React-Router4 (Basierend auf Webpack)

vue.js-Methode zum Verschieben der Array-Position und gleichzeitigen Aktualisieren der Ansicht

Das obige ist der detaillierte Inhalt von$set- und Array-Update-Methoden in vue.js_vue.js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!