我的模型作为对象数组和当前元素的索引存储在Vuex中。然后在我的组件中,我使用这两个信息来为数组中当前模型的大量输入设置值。
我的问题是,当我为某个字段(数组中当前对象的属性)设置值并将当前元素的索引更改为另一个时,此新模型在对象中没有此属性(模型是动态对象,没有预定义字段),因此只要我不返回设置该值的索引,然后更改为另一个值,它就会消失。
商店
const state = {
data: {
fields: [],
},
currentField: -1
}
const mutations = {
updatField (state, obj) {
state.data.fields[state.currentField][obj.attr] = obj.value
},
setCurrentField (state, value) {
state.currentField = value
},
}
查看
<template>
<v-form ref="form">
<v-text-field v-for="attr in fieldsDefinition" :key="attr.label"
:value="field['attr'][attr.label]"
:label="attr.label"
@input="update(label)"
></v-text-field>
</v-form>
</template>
<script>
export default {
store,
components: { field },
mixins: [ fieldsDefinition],
data () {
return {
fieldsDefinition: this.getFieldsDefinition()
}
},
methods: {
update (attr) {
this.$store.commit(this.change, { attr, value: event.target.value })
},
select (index, type) {
this.$store.commit('setCurrentField', index)
}
}
computed: {
...mapState({
field: state => state.data.fields[state.currentField],
currentField: state => state.currentField
})
}
}
</script>
( this.getFieldsDefinition()返回要渲染的字段的定义,其中包含字段等的标签。)