1、某个选择器失效,点击后下拉框缩回,但数据没有被渲染上,控制台打印v-model绑定的数据却发现已经改变,在其他好用的选择器选择或者其他的输入框输入后,此选择器的值显示出来了
<el-date-picker v-model="relForm.startDate" :picker-options="pickerStart" placeholder="选择日期">
</el-date-picker>
2、尝试过的方案
(1)绑定@change方法,方法中强刷表单
this.$forceUpdate()
(2)对v-model绑定的值做监听,用$set刷新数据
(3)重新定义表单中没有或者为空的参数
(4)修改控制台中报的所有Vue Warn和Vue Error
3、以上方法均无效,后修改获取数据的方式,先对获取到的数据进行序列化和反序列化,然后通过循环从对象中一个个取出来再一个个写进去,能够解决此问题
let relForm = JSON.parse(JSON.stringify(res.data))
for (let i in relForm) {
this.relForm[i] = relForm[i]
}
4、原因推测
经过调研,发现所有存在v-if分支的选择器,基本上都会出现此类问题,推测有可能是因为页面渲染的时候,数据还没有加载,导致绑定失败