el-date-picker限制只能选择当前时间前/后的时间（包含日期、时、分）

限制只能选择当前时间前/后的时间（包含日期、时、分）

1. 首先需要给添加一个属性picker-options属性,然后在data中定义这个pickerOptions属性。

<el-date-picker
  v-model="saveForm.startTime"
  :picker-options="pickerOptions"
  format="yyyy-MM-dd HH:mm"
  value-format="timestamp"
  type="datetime"
  placeholder="选择开始时间"
  style="width: 47%"
  default-time="9:00:00"
/>

2. disabledDate用于禁用当前日期前的所有日期，有的小伙伴可能会疑问，为什么要“-8.64e7”，是因为单纯使用time.getTime() < Date.now() 这段代码的效果是会使当前日期也会被禁用掉，这时候就需要在当前日期的基础上减掉一天，表示可以选择当天。
   限制完日期后，可能还会需要限制时间的选择，这里我们使用selectableRange对时间进行限制，获取当前时间，然后做一个时间的拼接即可。限制只能选择当前时间前的代码如下，稍微变动一下：

data(){
  return:{
     pickerOptions: {
     disabledDate: time => {
            return time.getTime() < Date.now() - 8.64e7
          },
     selectableRange: new Date().getHours() + ':' + (new Date().getMinutes() + 1) + ':00' + ' - 23:59:59'
         }
  }
}

3 ,以上代码只是限制了当天的的时间的选择，还没有完成。我们需要在合适的时间对我们的时间选择框进行放开和限制。比如限制只能选择当前时间前的时间，那么前一天的时间是00:00:00-23:59:59的时间都可以选择，而今天则不能放开全选。参考以下代码：

watch:{
  // 开始时间
  'saveForm.startTime'(selectTime){
    const date = new Date(new Date(selectTime).setHours(0,0,0,0)).getTime()
    const today = new Date(new Date().setHours(0,0,0,0)).getTime()
    if (date <= today){
      // 当选择的日期就是当天的时候，这个时候就要限制时间应当大于此时此刻的时分秒
      this.pickerOptions.selectableRange =  new Date().getHours() + ':'+(new Date().getMinutes()+1)+':00' + '- 23:59:59'
    }else {
      // 当选择的日期大于当天的时候，这时需要把时分秒的限制放开，否则不能选择
      this.pickerOptions.selectableRange = '00:00:00 - 23:59:59'
    }
  },
  // 结束时间
  'saveForm.endTime'(selectTime){
    const date = new Date(new Date(selectTime).setHours(0,0,0,0)).getTime()
    const today = new Date(new Date().setHours(0,0,0,0)).getTime()
    if (date <= today){
      // 当选择的日期就是当天的时候，这个时候就要限制时间应当大于此时此刻的时分秒
      this.pickerOptions.selectableRange =  new Date().getHours() + ':'+(new Date().getMinutes()+1)+':00' + '- 23:59:59'
    }else {
      // 当选择的日期大于当天的时候，这时需要把时分秒的限制放开，否则不能选择
      this.pickerOptions.selectableRange = '00:00:00 - 23:59:59'
    }
  }