最近项目当中需要编辑时间的需求,同事小姐姐在修改的时候发现值已经改变,但是页面并没有更新,问了我,我也是第一次遇见这个问题
<el-date-picker
v-model="value1"
type="monthrange"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd">
</el-date-picker>
经过我一番百度,知道了原因:因为数据层次太多,render函数没有自动更新,需手动强制刷新
那就找找时间选择器的事件吧
在这里要注意@change可能不会触发
,那又该咋办呢?
用@blur
替代@change
<el-date-picker
v-model="data.value1"
type="monthrange"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
@blur="changeDate">
</el-date-picker>
changeDate(val) {
this.$forceUpdate();
this.data.value1 = val;
}
这样就好啦~
同事小姐姐说她知道问题在哪了……
因为是列表传值到dialog中,原来是直接传value1,在dialog接收
现在改成直接把那一行所有数据data都传过来,让它自己匹配
两种办法,大家自己试试哪种可行吧~~~
今天也是努力搬砖的小花吖~
就酱!啾咪~