可以通过设置 DateTimePicker 组件的属性来实现最长只能选到开始时间往后退一年的功能。具体步骤如下:

  1. 在 DateTimePicker 组件中设置 type 属性为'datetime',表示使用日期时间选择器。
  2. 设置 picker-options 属性,其中设置 disabledDate 属性为一个函数,用于判断日期是否可选。函数接收一个参数 date,表示当前日期,需要返回一个布尔值,表示该日期是否可选。在函数中判断当前日期是否比开始时间往后推一年还晚,如果是则返回 true,表示该日期不可选。
  3. 在 DateTimePicker 组件中设置 value-format 属性为'yyyy-MM-dd HH:mm:ss',表示日期时间的显示格式。

下面是示例代码:

<template>
  <div>
    <el-date-time-picker
      v-model="dateTime"
      type="datetime"
      :picker-options="pickerOptions"
      value-format="yyyy-MM-dd HH:mm:ss"
    ></el-date-time-picker>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        dateTime: '',
        pickerOptions: {
          disabledDate(date) {
            const startDate = new Date('2020-01-01 00:00:00')
            const endDate = new Date(startDate.getFullYear() + 1, startDate.getMonth(), startDate.getDate(), 23, 59, 59)
            return date > endDate
          }
        }
      }
    }
  }
</script>
Element UI DateTimePicker: 限制选择时间范围 - 最长选到开始时间往后一年

原文地址: https://www.cveoy.top/t/topic/nm6U 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录