如下图所示:限制日期选择器只能上下浮动一个月并且要小于今天
代码如下:
<el-date-picker
v-model="searchForm.creatTime"
:picker-options="pickerOptions"
class="setDatePicker"
type="daterange"
range-separator="至"
start-placeholder="开始时间"
end-placeholder="结束时间"
value-format="yyyy-MM-dd"/>
data() {
return {
selectDate: '',
// 日期选择范围在一个月内,小于今天
pickerOptions: {
onPick: ({ maxDate, minDate }) => {
this.selectDate = minDate.getTime();
if (maxDate) {
this.selectDate = '';
}
},
disabledDate: time => {
if (this.selectDate !== '') {
// 如果选择了一天
const oneMonth = 30 * 24 * 3600 * 1000;
const minTime = this.selectDate - oneMonth;
const maxTime =
this.selectDate + oneMonth > Date.now() - 8.64e7
? Date.now() - 8.64e7
: this.selectDate + oneMonth;
return time.getTime() < minTime || time.getTime() > maxTime;
} else {
// 什么也没有选择的状态直接限制小于今天
return time.getTime() > Date.now() - 8.64e7;
}
}
}
};
},