在给项目增加一个按时间筛选的条件,当在组件右边点击x清空时,传入后端的时间参数就为空了,这就导致查出来的数据是全部。
为了让点击清空按钮后条件不为空,可用watch监听其值变化,我设置默认为当前日期。
相关代码如下:
<el-form-item :label="$t('Period')">
<el-date-picker v-model="startDay" type="date"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
:picker-options="startDayPickOption" >
</el-date-picker>
-
<el-date-picker v-model="endDay" type="date"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
:picker-options="endDayPickOption" >
</el-date-picker>
</el-form-item><br/>
watch: {
"startDay"(newVal1) {
if (newVal1 == null) {
this.startDay=this.DateUtils.formatStandardDate(new Date());
this.endDay = this.DateUtils.formatStandardDate(new Date());
}
},
"endDay"(newVal2) {
if (newVal2 == null) {
/* 获取当前时间工具类:DateUtils.formatStandardDate */
this.endDay = this.DateUtils.formatStandardDate(new Date());
this.startDay=this.DateUtils.formatStandardDate(new Date());
}
},
}
当然监听后想更改的时间可以自己定义。