el-date-picker

选择日期范围，用两个独立的选择器来控制，总觉得比较混乱。

<el-date-picker
  ref="drawDate"
  :picker-options="pickerOptions"
  style="margin-left: 5px;"
  v-model="drawDate"
  value-format="yyyy-MM-dd"
  type="daterange"
  range-separator="至"
  start-placeholder="开始日期"
  end-placeholder="结束日期"
  @change="searchData"
></el-date-picker>

• 开始时间在当前日期之后

pickerOptions: {
  disabledDate(time) {
  return time.getTime() < Date.now() - 8.64e7;
  }
},  

• 开始时间结束时间控制在一定范围内，一般是接口的返回数据 ->this.data

this.pickerOptions = Object.assign(this.pickerOptions,{
  disabledDate: (time) => {
  return (time.getTime() < new Date(this.data.startTime)  - 8.64e7) || time.getTime() > new Date(this.data.endTime)
  },
})

中间的连接符一定要是||,return 有个布尔型默认值

• 时间范围控制在一周之内

`在data定义pickerMinDate变量 `
let that = this;  
this.pickerOptions = Object.assign(this.pickerOptions,{
    onPick: ({ maxDate, minDate }) => {
    that.pickerMinDate = minDate.getTime();
        if (maxDate) {
        that.pickerMinDate = '';
        }
      },
    disabledDate(time) {
    // onPick后触发
    if (that.pickerMinDate !== '') {
          //结束时间在开始时间7天内
        let one =  6 * 24 * 3600 * 1000,
         minTime = that.pickerMinDate - one,
         maxTime = that.pickerMinDate + one;
        if(minTime && maxTime ){
        return time.getTime() < minTime || time.getTime() > maxTime
        }
    }
    // return time.getTime() > Date.now();
  }
})