Wie gehe ich mit dem Problem um, dass die Ansicht nicht aktualisiert wird, wenn Objekteigenschaften in Vue geändert werden?

Im Folgenden werde ich einen Artikel mit Ihnen teilen, der das Problem löst, dass die Ansicht nicht aktualisiert wird, wenn Objekteigenschaften in Vue geändert werden. Er hat einen guten Referenzwert und ich hoffe, dass er für alle hilfreich sein wird.

Normalerweise legen wir die Antwortdaten in den Daten der Vue-Instanz fest. Wenn es sich bei den Daten jedoch um ein Objekt handelt und wir den Objektattributwert hinzufügen oder löschen, löst die Ansicht keine Aktualisierung aus. Wie kann dieses Problem gelöst werden?

Der Beispielcode lautet wie folgt:

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

Es gibt drei Lösungen:

Option 1: Vue.set(object,key,val) verwenden

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

Option 2: Verwenden Sie this.$set(this.obj,key,val)

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

Option 3: Verwenden Sie Object.assign({}, this.obj) zum Erstellen ein neues Objekt

Beispiel:

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

oder

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

Das Obige ist das, was ich für alle zusammengestellt habe wird in Zukunft für alle hilfreich sein.

Verwandte Artikel:

So fügen Sie Abfragemethoden über Tabellen in AngularJs hinzu, löschen und ändern sie

So verwenden Sie ExtJs zur Integration von Echarts (ausführliches Tutorial)

So fügen Sie div-Methoden in AngularJS dynamisch hinzu und löschen sie

Das obige ist der detaillierte Inhalt vonWie gehe ich mit dem Problem um, dass die Ansicht nicht aktualisiert wird, wenn Objekteigenschaften in Vue geändert werden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!