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!