通过:picker-options="pickerOptions"控制时间选择
// 日期选择器其实也提供方法Picker Options
<el-date-picker
v-model="date"
type="date"
size="small"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
:placeholder="'选择日期'"
:picker-options="pickerOptions"
</el-date-picker>
在data中定义pickerOptions即可
// 今天之前时间禁用
pickerOptions: {
//这里是限制今天以前的时间将其禁用
//如果减去后面的时间24 * 60 * 60 * 1000,禁止用户选择今天之前的日期,不包含今天;否则禁止用户选择今天之前的日期,包含今天
disabledDate(time) {
return time.getTime() < new Date().getTime() - 24 * 60 * 60 * 1000;
},
//这里限制了只能选择当前时间的五分钟后
selectableRange:
new Date().getHours() +
":" +
(new Date().getMinutes() + 5) +
":00 - 23:59:00",
},
今天之后时间禁用
pickerOptions: {
//这里是限制今天之后的时间将其禁用
//如果减去 24 * 60 * 60 * 1000今日不可选,如果不减则今日可选
disabledDate(time) {
return time.getTime() > new Date().getTime();
},
//这里限制了只能选择当前时间的五分钟后
selectableRange:
new Date().getHours() +
":" +
(new Date().getMinutes() + 5) +
":00 - 23:59:00",
},