Element-UI DateTimePicker 设置最长选择时间限制 (一年)
可以通过设置 DateTimePicker 组件的 `picker-options` 属性来限制最长只能选一年的时间,具体实现方法如下:
- 在 DateTimePicker 组件中设置 `picker-options` 属性,如下所示:
- 在 Vue 实例中定义 `pickerOptions` 对象,并设置 `disabledDate` 方法,如下所示:
<el-date-picker
v-model="date"
type="datetime"
:picker-options="pickerOptions"
placeholder="选择日期时间"
></el-date-picker>
data() {
return {
date: '',
pickerOptions: {
disabledDate(time) {
// 获取当前时间
const now = new Date();
// 获取一年前的时间
const oneYearAgo = new Date(now.getFullYear() - 1, now.getMonth(), now.getDate());
// 返回当前时间是否在一年前之后
return time.getTime() < oneYearAgo.getTime();
}
}
}
}
通过上述代码,可以实现 DateTimePicker 组件最长只能选一年的时间。其中,`disabledDate` 方法用于判断当前时间是否在一年前之后,如果是,则禁止选中该时间。
原文地址: https://www.cveoy.top/t/topic/jCS1 著作权归作者所有。请勿转载和采集!