正確的方法來動態設置許多輸入值，從Vuex商店獲取數據

Question

我很新Vue。我有很多輸入的大型表格。我想將存儲在Vuex存儲中的所有數據作爲類的屬性。

const store = new Vuex.Store({ 
    state: { 
     cv: new CurriculumVitae() 

我可以伊斯利更新這樣的價值觀：

<input @input="updateValue" name="name"> 
... 
methods: { 
    updateValue(e) { 
     this.$store.commit('updateValue', {field: e.target.name, value: e.target.value}); 
    } 
}, 
.... 
const store = new Vuex.Store({ 
    mutations: { 
     updateValue (state, payload) { 
      state.cv.data[payload.field] = payload.value; 
     } 
    } 

我怎麼能插入一個CurriculumVitae class實例數據填充到店，並已全部投入預裝有自動的數據？我不想爲每個輸入都寫v模型並單獨填寫。有沒有一種更好，更動態的方法來實現這一目標？

編輯：我只想有很好的方式來更新對象。當創建新的 - 我不需要任何填充任何東西的輸入。編輯時 - 將舊數據加載到輸入中會很好。我喜歡它是動態的，而不是爲每個輸入編寫模型並從商店返回特定值。就像我在將更新保存到商店時一樣：這只是所有輸入的一種方法。

Vue提供了一種方法來做到這一點？

Answer 1

導出功能，將在存儲文件 // store.js

import {CurriculumVitae} from 'data'

實例化的函數返回的數據 // data.js

export function CurriculumVitae() { 
    return {data: {name: 'John Doe', gender: 'Male'} } 
} 

導入功能。 //store.js

const store = new Vuex.Store({ 
state: { 
    cvs: CurriculumVitae() // here 

在組件文件 // myComponent.vue

computed: { 
    cvs(){ 
     return store.state.cvs // here 
    } 
} 

<input type="text" :value="cvs.data.name"> <!-- here --> 

見，如果這個工程。