I have a Vuex state, like this (it also has a getter, named configs
:
configs: {
1303401: {
exampleValue: 'test'
}
}
I also have an input where I v-model the exampleValue
from the Vuex store's state:
<input type="text" v-model="config.exampleValue" />
Here is the computed property I use to return the config
:
config: {
get () {
return this.$store.getters.configs[1303401]
},
set (value) {
//this should set the configs[1303401] field with the updated exampleValue
this.$store.dispatch('UPDATE_CONFIG', value)
}
}
The input's value changes to the value of config.exampleValue
, so the computed data is not undefined, but the Vuex state does not update.
Also if I try to console.log
the value in the setter, nothing appears in the console, so the setter isn't even executed
It is probably because it is not setting the config
computed property, but the config.exampleValue
, but I have no idea, how to handle that.
我认为这是因为您将v模型与get对象的属性一起使用,而setter无法对其进行处理。 您只能使用属性,这是您计算出的属性的外观:
和模板:
因此,您将在存储操作中获得新的exampleValue值。并尝试避免在计算属性(带有表单)中使用对象进行getter / setter操作,因为它具有很多隐藏陷阱。