DatePicker 日期选择器（开始时间应不允许大于结束时间）

第一种方式：设置开始时间应不允许大于结束时间：

 

html代码为：

<div class="valCom">
   <el-radio v-model="validityType" :label="true">&nbsp;</el-radio>固定日期 
   <el-date-picker v-model="validityTermStart" type="date" placeholder="选择开始时间" :picker-options="pickerOptionsStart" value-format="yyyy-MM-dd HH:mm:ss" style="width:150px;margin-right:10px;"></el-date-picker> -
   <el-date-picker v-model="validityTermEnd" type="date" placeholder="选择结束时间" :picker-options="pickerOptionsEnd" value-format="yyyy-MM-dd HH:mm:ss" style="width:150px;"></el-date-picker>
</div>

export default {
   data() {
      return {
           validityTermStart:'',//有效期开始时间

            validityTermEnd:'',//有效期结束时间

           pickerOptionsStart:{
              disabledDate:(time)=>{

                    if(this.validityTermEnd) {

                        return time.getTime() < Date.now()-8.64e7 || time.getTime() > new Date(this.validityTermEnd).getTime() - 1*24*60*60*1000;

                    }

                    return time.getTime() < Date.now()-8.64e7;

             }
           },
           pickerOptionsEnd:{
             disabledDate:(time)=>{

                   return time.getTime() < Date.now()-8.64e7 || time.getTime() < new Date(this.validityTermStart).getTime() + 1*24*60*60*1000;

             }
          }
      }
   }
}

 

本地效果为：http://localhost:8080/#/marketPart/couponListNew?isCreate=1

element-ui日期选择器里面设置时间范围(限制开始时间和结束时间)    https://blog.csdn.net/weixin_43565820/article/details/89883512