iview中時間選擇器可設置選擇範圍一個月方法

功能展現以下：

​

根據需求要求，要求選擇日期範圍爲一個月：在選擇了起始時間後，結束時間以內選擇以後的一個月時間，到下個月17日

具體代碼以下：

<Form-item label="決策時間" style="margin-bottom: 2px;">
                <Date-picker :editable="false" type="datetime" confirm :transfer="true" v-model="qualityCheck.decisionStartTime"  placeholder="選擇開始日期" format="yyyy-MM-dd HH:mm:ss"
                             style="width: 47%" size="small"  @on-change="changeEndTime" :options="decisionStartTime">
                </Date-picker>
                -
                <Date-picker :editable="false" type="datetime" confirm :transfer="true" v-model="qualityCheck.decisionEndTime"  placeholder="選擇結束日期" format="yyyy-MM-dd HH:mm:ss"
                             style="width: 47%" size="small" @on-change="changeStartTime" :options="decisionEndTime">
                </Date-picker>
              </Form-item>複製代碼

此處主要重點在兩個地方：

①@on-change=""

②:options=""

on-change調用change方法後，修改option中保存的值：

changeStartTime: function (e) {
        var time = e
        var that = this
        var days = new Date(new Date().getFullYear(), (new Date().getMonth() + 1), 0).getDate() - 1
        var startEndTime = time ? new Date(time).valueOf() - days * 24 * 60 * 60 * 1000 : ''
        var endEndTime = time ? new Date(time).valueOf() : ''
        if (time === '') {
          this.decisionStartTime = {
            disabledDate (data) {
              return data.valueOf() < 0
            }
          }
        } else {
          this.decisionStartTime = {
            disabledDate (data) {
              if (that.qualityCheck.decisionEndTime === '') {
                return new Date()
              }
              return data.valueOf() < startEndTime || data.valueOf() > endEndTime
            }
          }
        }
      }複製代碼

此到處理this.decisionStartTime 返回的disableDate便可。

注：記得點擊X，刪去時間時，須要將disableDate清空，否則會出現日期不能選擇的狀況