Elementui,日期区间空间,动态禁用日期disabledDate。

需求,默认选择十天区间,并且每次选择的日期必须小余90天。

/**
 *  日期控件动态设置最大跨度,解决elementui日期区间,第一次点击日期,动态处理disabledDate禁用日期的跨度。
 *  @param {Number} _this this
 *  @param {Number} day 天
 *  @returns {Blob} 返回pickerOptions数据
 *  @example this.$yFc.pickerOptionsDynamic(this, 90);
 * */
export function pickerOptionsDynamic(_this, day) {
  let minDate = null;
  const pickerOptions = {
    disabledDate(time) {
      if (minDate === null) {
        const min = Date.now() - 3600*1000*24*day;
        return time.getTime() > Date.now() || time.getTime() < min;
      } else {
        const max = new Date(minDate).getTime() + 3600*1000*24*day;
        const min = new Date(minDate).getTime() - 3600*1000*24*day;
        if (max >= Date.now()) {
          return time.getTime() > Date.now() || time.getTime() < min;
        } else {
          return time.getTime() > max || time.getTime() < min;
        }
      }
    },
    onPick: (opt) => {
      minDate = _this.parseTime(opt.minDate, '{y}-{m}-{d}'); // 若依的方法,可更换
    }
  }
  return pickerOptions;
}

你可能感兴趣的:(Elementui,日期区间空间,动态禁用日期disabledDate。)