Ausführliche Erklärung zum Aktualisieren von $set und array in vue.js

Aufgrund von JavaScript-Einschränkungen kann Vue die folgenden geänderten Arrays nicht erkennen: wenn der Index verwendet wird, um ein Element des Arrays direkt festzulegen, zum Beispiel: vm.items[indexOfItem] = newValue

Wenn Sie das ändern Länge des Arrays Wenn 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 also der Instanz nach der Erstellung der Instanz neue Eigenschaften hinzugefügt werden, wird die Aktualisierung nicht ausgelöst .

ps: Es gibt jetzt zwei Arrays, arr1 und arr2. Wenn arr1 das Array durch Zuweisen eines Indexwerts ändert und arr2 das Array durch $set ändert, was wird das Ergebnis sein?

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 dem aktualisiert Seite, nur die zweiten Array-Änderungen werden 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.

Verwandte Empfehlungen:

Detaillierte Erläuterung der VUE-Array-Aktualisierung

So aktualisieren Sie das Array in der Datenbank in PHP

, eine Methode zum Aktualisieren von MySQL-Datenbankdaten mithilfe von Arrays

Das obige ist der detaillierte Inhalt vonAusführliche Erklärung zum Aktualisieren von $set und array in vue.js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!