2017-02-06 6 views
0

Ich verwende vue2. will ich wählen Sie die Option Objekt bekommen in v-fürvue - Option auswählen Auslöser ändern vuex Mutationsfehler

HTML:

 <select 
     class="custom-select" 
     @change="onPlanSelected($event)" 
     v-model="selectedPlan.objectId"> 
     <option 
      v-for="plan in plans" 
      :key="plan.objectId" 
      :value="plan.objectId"> 
      {{ plan.title }} 
     </option> 
     </select> 

JS:

data() { 
    return { 
    selectedPlan: {} 
    } 
} 

onPlanSelected (event) { 
    this.selectedPlan = this.plans.find(plan => { 
    return plan.objectId === event.target.value 
    }) 
} 

, wenn ich die wählen Sie die Option ändern, erhalte ich die Fehlermeldung:

enter image description here

Wie Sie sehen können, ausgewähltePlan ist Daten nicht Vuex.

Btw, wie ein Objekt aus einer select v-Option für

Dank

+0

Ändern Sie eine vuex-Speichervariable irgendwo: – Saurabh

Antwort

0

Zunächst einmal bekommt ich sehe nicht die Notwendigkeit von @change in Ihrem Fall verwenden. v-model sollte für die Handhabung der ausgewählten Option ausreichen. Hier ein Beispiel Geige: https://jsfiddle.net/z11fe07p/567/

Solange Sie das gesamte Objekt als :value und v-model und haben Sie immer die gewählte Option zusammen mit seinem id.

+0

thx, es funktioniert! sieht so aus, als ob ich es nicht in der ausgewählten Option von Vue bekommen hätte. – KevinHu