Element --日期时间的禁用（约束）

1.禁用选择器时间

<template>
  <div id="app">
    <el-date-picker
      :picker-options="setDisabled"
    >
    </el-date-picker>
  </div>
</template>

<script>
export default {
  data() {
    return {
    
      setDisabled: {
        disabledDate(time) {
          return time.getTime() > Date.now();  // 可选历史天、可选当前天、不可选未来天
          // return time.getTime() > Date.now() - 8.64e7;  // 可选历史天、不可选当前天、不可选未来天
          // return time.getTime() < Date.now() - 8.64e7;  // 不可选历史天、可选当前天、可选未来天
          // return time.getTime() < Date.now(); // 不可选历史天、不可选当前天、可选未来天
          
          /*只能选择今天前的近七天*/
		  // let now = Date.now();
          // let seven = 7 * 8.64e7;
          // let sevenDays = now - seven;
          // return time.getTime() > now || time.getTime() < sevenDays;  //大于今天和小于七天前的禁用
        },
      },
      
    };
  },
 };
  /*
    8.64e7 是科学计数法 8.64乘以10的7次方，即为86400000也就是 1000*60*60*24 也就是一天的毫秒数。
    因为Date.now()方法能够返回得到自1970年1月1日00:00:00(UTC)到当前时间的毫秒数。咱们是北京时间
    的时区，也就是为东8区，起点时间对应就是："1970/01/01 08:00:00"
    
    picker-options需要一个最终的布尔值，所以是否减去8.64e7也就是是否往前推移一天，也就是是否包
    含当前的天数
  */
</script>

2.开始时间和结束时间相互约束，并且时间不可选未来

<template>
  <div>
    <el-date-picker
      v-model="startDate"
      :picker-options="startPickerOptions"
      @change="handleStartDateChange"
    ></el-date-picker>
    <el-date-picker
      v-model="endDate"
      :picker-options="endPickerOptions"
      :disabled="!startDate"
      @change="handleEndDateChange"
    ></el-date-picker>
  </div>
</template>

<script>
export default {
  data() {
    return {
      startDate: '',
      endDate: '',
      currentDateTime: new Date(),
      startPickerOptions: {
        disabledDate: (time) => {
          return time.getTime() > Date.now()
        }
      },
      endPickerOptions: {
        disabledDate: (time) => {
          return time.getTime() > Date.now() || time.getTime() < new Date(this.startDate).getTime()
        }
      }
    }
  },
  methods: {
    handleStartDateChange(val) {
      this.endDate = ''
      this.endPickerOptions = {
        disabledDate: (time) => {
          return time.getTime() > Date.now() || time.getTime() < new Date(val).getTime()
        }
      }
    },
    handleEndDateChange(val) {
      this.startPickerOptions = {
        disabledDate: (time) => {
          return time.getTime() > new Date(val).getTime()
        }
      }
    }
  }
}
</script>