iView 日期选择器开始时间至结束时间限制

需要考虑以下条件

1. 开始时间和结束时间都不能大于当前时间
2. 开始时间不能大于结束时间

html

<FormItem label="起止时间">
  <DatePicker type="date" v-model="searchForm.startTime" :options="startOptions" placeholder="请选择开始时间" style="width: 200px"></DatePicker>
  <DatePicker type="date" v-model="searchForm.endTime" :options="endOptions" placeholder="请选择结束时间" style="width: 200px"></DatePicker>
</FormItem>

在data中设置开始时间和结束时间不能大于当前时间

searchForm: {
  startTime: "",
  endTime: "",
},
startOptions: {
  disabledDate(date) {
    return date && date.valueOf() > Date.now();
  },
},
endOptions: {
  disabledDate(date) {
    return date && date.valueOf() > Date.now();
  },
},

watch监听开始时间和结束时间，并做限制

watch: {
  'searchForm.startTime'() {
    let self = this;
    this.endOptions = {
      disabledDate(date) {
        console.log('date',date)
        if (self.searchForm.startTime) {
          return date && (date.valueOf() < self.searchForm.startTime || date.valueOf() > Date.now());
        }
      },
    };
  },
  'searchForm.endTime'() {
    let self = this;
    this.startOptions = {
      disabledDate(date) {
        if (self.searchForm.endTime) {
          return  date && (self.searchForm.endTime < date || date.valueOf() > Date.now())
          
        }
      },
    };
  },
},