比如:
<input v-model="obj.a"/>
data(){
return {
obj:{}
}
}
如果在ui渲染完之后,obj对象里面根本没有a属性,那么input组件绑定的obj.a就并非是响应式的。也就是说用户输入了‘XXX‘,那么obj不会出现a属性且a:'XXX'。
对于公司用的二次封装的组件更明显,比如基于Eui二次开发的Cui。
对于组件cui-select选择器,其需要绑定的v-model是一个数组,
我们给他绑定 :
<cui-select v-model="obj.arr"/>
data(){
return {
obj:{}
}
}
渲染ui时,obj是不存在arr属性的,也就是obj.arr = undefined。
当我们在界面上操作cui-select时,其功能会错乱,并且不会响应到obj.arr上。
解决方法
直接在界面渲染之前,将ui绑定的对象的属性进行初始化即可,例如:
<cui-select v-model="obj.arr"/>
data(){
return {
obj:{
arr:[]
}
}
}