element ui组件的开始时间-结束时间验证

<el-date-picker  v-model="seach.before" type="date" placeholder="开始时间"  value-format="yyyy-MM-dd" class="wida" :picker-options="pickerBeginDateBefore"  @change="changeTime">
</el-date-picker>
    <span class="zhi">至</span>
<el-date-picker   v-model="seach.after" type="date" placeholder="结束时间"value-format="yyyy-MM-dd" class="wida" :picker-options="pickerBeginDateAfter">
</el-date-picker>
seach:{
  before:'',
  after:'',
},
  // 开始时间不大于结束时间
        // 开始时间
        pickerBeginDateBefore: {
          disabledDate: (time) => {
            let beginDateVal = this.seach.after;
            if (beginDateVal) {
              return time.getTime() > beginDateVal;
            }
          }
        },
        // 结束时间
        pickerBeginDateAfter: {
          disabledDate: (time) => {
            let beginDateVal = this.seach.before;
            if (beginDateVal) {
              return time.getTime() < beginDateVal;
            }
          }
        },
//选择开始时间,清空结束时间
      changeTime(date){
        // this.seach.before="";
        // console.log(this.seach.before)
        this.pickerBeginDateAfter={
          disabledDate(time) {  //开始时间-结束时间
            return (time.getTime() < new Date(date).getTime());
          }
        }
      },

 

来源:https://www.cnblogs.com/M-miao/p/9838727.html   element ui组件的开始时间-结束时间验证

 

posted @ 2019-07-14 09:51  BloggerSb  阅读(1176)  评论(0编辑  收藏  举报