2016-11-29 3 views
9

Aktualisierung habe ich die folgenden Getter:Vuex Getter nicht

withEarmarks: state => { 
    var count = 0; 
    for (let l of state.laptops) { 
     if (l.earmarks.length > 0) { 
      count++; 
     } 
    } 
    return count; 
} 

Und in einem Bauteil, diese berechnete Eigenschaft von diesem Getter abgeleitet:

withEarmarks() { return this.$store.getters.withEarmarks; }, 

Der zurückgegebene Wert korrekt ist, bis ich ein ändern Element innerhalb des Laptops-Array, und dann aktualisiert der Getter nicht.

+0

Wie werden Sie Änderungen in der 'laptops' Array zu machen, können Sie diesen Code enthalten. – Saurabh

+0

@saurabh Ich habe beide Möglichkeiten ausprobiert: 'state.laptops [index] = laptop;' und 'state.laptops [index] = Object.assign ({}, laptop);' – daninthemix

Antwort

21

In Ihrem Fall state.laptops.earmarks ist ein Array, und Sie manipulieren es durch seine Array-Index state.laptops[index]. Vue kann nicht auf Mutationen auf Zustandsarrays (nach Index) reagieren. Die Dokumentation bietet zwei Abhilfen für diese:

// 1. use purpose built vue method: 
Vue.set(state.laptops, index, laptop) 

// 2. splice the value in at an index: 
state.laptops.splice(index, 1, laptop) 

Obwohl es dokumentiert ist, ich bin ein riesiges Neon denken leuchtende Zeichen auf dieser Seite, die sagt: „Sie werden Stunden Produktivität verschwenden, wenn Sie nicht wissen“ wäre eine nette Ergänzung.

Sie können mehr über diese „Einschränkung“ hier lesen: https://vuejs.org/v2/guide/list.html#Caveats

Verwandte Themen