Vue+ElementUI 限制结束时间不能大于开始时间

el-date-picker 组件的 picker-options属性

直接上代码

 <el-form-item label="证书有效期:" class="timeHook">
        <el-col :span="0.5">
          <el-form-item prop="startdate">
            <el-date-picker 
            type="date" 
            :editable="false"
            value-format="yyyy-MM-dd" 
            placeholder="请选择开始时间" 
            v-model="sxyInfo.startdate"
            :picker-options="pickerOptionsStart"
            style="width: 100%;"></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="1" style="text-align:center;">至</el-col>
        <el-col :span="0.5">
          <el-form-item prop="enddate">
            <el-date-picker
            type="date"
            :editable="false"
            value-format="yyyy-MM-dd"
            placeholder="请选择结束时间"
            v-model="sxyInfo.enddate"
            style="width: 100%;"
            :picker-options="pickerOptionsEnd"
           ></el-date-picker>
          </el-form-item>
        </el-col>
      </el-form-item>

 

data(){
return{
sxyInfo:{},
pickerOptionsStart: {
        disabledDate: time => {
          let endDateVal = this.sxyInfo.enddate;
          if (endDateVal) {
            return time.getTime() > new Date(endDateVal).getTime();
          }
        }
      },
      pickerOptionsEnd: {
        disabledDate: time => {
          let beginDateVal = this.sxyInfo.startdate;
          if (beginDateVal) {
            return (
              time.getTime() <
              new Date(beginDateVal).getTime() - 1 * 24 * 60 * 60 * 1000
            );
          }
        }
      },
}
}