element ui date-picker 日期范围不能超过三

日期组件type为daterange时，需要控制最长日期不能超过三十天。

通过使用组件"picker-options"对象,进行控制，主要用到，onPick及disabledDate.

picker-options:当前时间日期选择器特有的选项，类型object

disabledDate:设置禁用状态，参数为当前日期，要求返回Boolean，类型Function

onPicker:选中日期后会执行的回调，只有当dateRange活dateTimeRange才生效，类型Funciton({maxDate,minDate})

具体用法如下：

1)组件写法：

 <el-date-picker

            v-model="searchForm.date"

            type="daterange"

            range-separator="-"

            value-format="yyyyMMdd"

            start-placeholder="开始日期"

            end-placeholder="结束日期"

            @blur="isRestart = true"

            :picker-options="pickerOptions"

            clearable

          > </el-date-picker>

2）pickerOptions 定义：

 pickerOptions: {

        onPick: ({

          maxDate,

          minDate

        }) => {

          this.isRestart = false

          this.pickerMinDate = minDate.getTime()

          if (maxDate) {

            this.pickerMinDate = ''

          }

        },

        disabledDate: (time) => {

          if (this.curveTime && this.isRestart) {

            // 存在选中的日期且没有重新选择日期 不做禁用处理

            return

          }

          if (this.pickerMinDate !== '') {

            const one = 30 * 24 * 3600 * 1000

            const minTime = this.pickerMinDate - one

            const maxTime = this.pickerMinDate + one

            return time.getTime() < minTime || time.getTime() > maxTime

          }

        }

      },

这样就完美解决，当鼠标点击开始日期后，结束日子就只能选中一个月以内的日期。