vuex文档中建议表单中v-model这样使用:
<input v-model="user">
computed: {
user: {
get () {
return this.$store.state.obj.user
},
set (value) {
this.$store.commit('updateUser, value)
}
}
}
但是:
element-ui如果要使用form组件的表单验证功能,表单v-model绑定的data必须写在一个对象里面,如下的formline
,也就是说它只验证formline
对象内部的属性值,以下element-ui文档的demo代码:
vue无法把一个计算属性写在一个对象(比如formline
)里面,即不可以使用如下这样的语法:
computed: {
// 错误代码
'formline.user': {
get () {
return this.$store.state.obj.user
},
set (value) {
this.$store.commit('updateUser', value)
}
}
}
我现在的做法是每次set操作commit后往formline
对象中添加对应的key&value,这样才可以使用element-ui的form验证功能,代码如下 :
computed: {
'user': {
get () {
return this.$store.state.obj.user
},
set (value) {
this.$store.commit('updateUser', value)
// 添加如下:
this.formline.user = value
}
}
}
但总感觉有点歪门邪道,不知道有其他更合理的解决方案?
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…