<el-date-picker
v-model=“formData.planTime”
@blur=“timeChange”
type=“datetimerange”
value-format=“yyyy-MM-dd HH:mm:ss” range-separator=“至”
start-placeholder=“开始日期” end-placeholder=“结束日期”>

当直接给formData.planTime赋值是 formData.planTime= value , 界面没有变化。但是formData.planTime值已经更新了。

原理:受 ES5 的限制,Vue.js 不能检测到对象属性的添加或删除。因为 Vue.js 在初始化实例时将属性转为 getter/setter,所以属性必须在 data 对象上才能让 Vue.js 转换它,才能让它是响应的。
要处理这种情况,我们可以使用$set()方法,既可以新增属性,又可以触发视图更新。
当然了,vue3就没有这个问题

this.$set(form, “planTime”, value)

Logo

前往低代码交流专区

更多推荐