【vue】使用el-date-picker遇到的坑：回显后没法更新数据

<el-form-item label="选择日期：" prop="timeArrange" required :label-width="formLabelWidth"

        >

          <el-date-picker class="info-form-times" v-model="form.timeArrange" type="daterange" unlink-panels value-format="timestamp" range-separator="至" start-placeholder="起始年月日" end-placeholder="结束年月日" @change="handleTimestamp"

          ></el-date-picker>

        </el-form-item>

 

 

我在使用elementUI里的日期选择器时，遇到了当没有设置选择器的初始值，首次打开，选择日期后，能够拉起@change事件；而当设置好回显值（初始值）时，没法拉起change事件的问题。

官网的el-date-picker组件的事件有如下三种：

官方文档中的事件

通过测试，当事件绑定改成blur时，拉起handleTimestamp方法成功。看来缘由出在事件监听的方式绑定上面。

@blur="handleTimestamp"

咱们再看一下源码中，为何是blur才行：

node_modules里，date-picker组件源码

node_modules里，date-picker组件内监听picker显示隐藏属性里拉起blur函数，但未拉起change函数。

使用blur事件驱动日期选择器数据问题，完美解决。