限制日期选择器范围最多30天 当前日期之后不可选

 <el-date-picker
    v-model="formSearch.dateRange"
    type="daterange"
    range-separator="至"
    start-placeholder="开始时间"
    end-placeholder="结束时间"
    value-format="yyyy-MM-dd "
    style="padding-top:0;padding-bottom:0"
    clearable
    class="ipt"
    :picker-options="pickerOptions"
/>

1.限制开始时间前后可选范围（30天）

  pickerMinDate: null,
  pickerMaxDate: null,
  day31: 31 * 24 * 3600 * 1000, // 禁用日期范围时间
  //限制日期选择器范围最多30天
  pickerOptions: {
    onPick: ({ maxDate, minDate }) => {
      console.log(maxDate, minDate);
      if (minDate && this.pickerMinDate) {
        this.pickerMinDate = null;
      } else if (minDate) {
        this.pickerMinDate = minDate.getTime();
      }
    },
    disabledDate: time => {
      if (this.pickerMinDate) {
        return (
          time.getTime() < this.pickerMinDate - this.day31 ||
          time.getTime() > this.pickerMinDate + this.day31
        );
      }
      return false;
    }
  },
  

2.限制开始时间前可选范围并当前之后日期不可选（30天）

  pickerMinDate: null,
  pickerMaxDate: null,
  day31: 31 * 24 * 3600 * 1000, // 禁用日期范围时间
  //当前日期之后不可选 并限制当前日期之前可选范围
  pickerOptions: {
    onPick: ({ maxDate, minDate }) => {
      console.log(maxDate, minDate);
      if (minDate && this.pickerMinDate) {
        this.pickerMinDate = null;
      } else if (minDate) {
        this.pickerMinDate = minDate.getTime();
      }
    },
    disabledDate: time => {
      if (this.pickerMinDate) {
        // ||time.getTime() > this.pickerMinDate + this.day31
        return (
          time.getTime() < this.pickerMinDate - this.day31 ||
          time.getTime() > Date.now()
        );
      } else {
        return time.getTime() > Date.now();
      }
    }
  },