关于vue.js:eldatepicker-动态日期范围

Vue2 & element ui

<el-date-picker type="daterange" :picker-options="pickerOptions"

let _minTime;
let _maxTime;
let timeRange = 10 * 24 * 60 * 60 * 1000;
export default {data() {
        return {
            pickerOptions:{onPick(time) {if (!time.maxDate) {_minTime = time.minDate.getTime() - timeRange;
                        _maxTime = time.minDate.getTime() + timeRange;} else {
                        _minTime = null;
                        _maxTime = null;
                        }
                    },
                  disabledDate(time) {if (_minTime && _maxTime) {return time.getTime() < _minTime || time.getTime() > _maxTime;}
                }
            }
        };
    }
    ……
};

Vue3 & element plus

<el-date-picker  type="daterange" :disabled-date="disabledDate" @calendar-change="eventCalendarChange"

let _minTime = null;
let _maxTime = null;
let timeRange = 3 * 30 * 24 * 60 * 60 * 1000;

const disabledDate = (time) => {if (_minTime && _maxTime) {return time.getTime() < _minTime || time.getTime() > _maxTime;}
};

const eventCalendarChange = (data) => {const [ start] = data;
    if (start) {_minTime = start.getTime() - timeRange;
        _maxTime = start.getTime() + timeRange;} else {
        _minTime = null;
        _maxTime = null;
    }
};