Element UI中的日期选择器中的时间限制

需求是:单次查询日期区间跨度不超过31天。

因为一个这里使用的是一个可以选择时间范围的时间选择器，所以可以不用做开始时间小于结束时间的限制。

 <template>
<div>
<el-date-picker
  value-format="yyyy-MM-dd"
  type="daterange"
  range-separator="至"
  start-placeholder="开始日期"
  end-placeholder="结束日期"
  :picker-options="pickerOptions"
  v-model="queryData.queryTime"
  >
   </el-date-picker>
</div>
 </template>
<script>
data(){
return {
queryDate:{
queryTime:""
 pickerMinDate: "",
      pickerOptions: {
        onPick: ({ maxDate, minDate }) => {
           // getTime()方法可以返回距离1970年1月1日的毫秒数
          this.pickerMinDate = minDate.getTime();
          if (maxDate) {
            this.pickerMinDate = "";
          }
        },
        disabledDate: (time) => {
          if (this.pickerMinDate !== "") {
            let one = 30 * 24 * 3600 * 1000;
            let minTime = this.pickerMinDate - one;
            let maxTime = this.pickerMinDate + one;
            if (maxTime > new Date()) {
              maxTime = new Date();
            }
            return time.getTime() < minTime || time.getTime() > maxTime;
          }
          return time.getTime() > Date.now();
        },
      },
}

</script>

本人是想通过此平台整理记录自己的笔记，如有问题，请指正；如有侵权，请与我本人联系转私密，非常感谢。