在element-ui中,DateTimePicker可以设置min-date和max-date属性,用于限制可选的最小和最大日期时间范围。

例如,以下代码可以实现DateTimePicker只能选择当前时间之后和一年内的日期时间:

<el-date-picker
  v-model="datetime"
  type="datetime"
  :min-date="new Date()"
  :max-date="new Date(new Date().getFullYear() + 1, 11, 31, 23, 59, 59)"
  :picker-options="{
    shortcuts: [{
      text: '今天',
      onClick(picker) {
        picker.$emit('pick', new Date())
      }
    }, {
      text: '昨天',
      onClick(picker) {
        const date = new Date()
        date.setTime(date.getTime() - 3600 * 1000 * 24)
        picker.$emit('pick', date)
      }
    }, {
      text: '一周前',
      onClick(picker) {
        const date = new Date()
        date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
        picker.$emit('pick', date)
      }
    }]
  }">
</el-date-picker>

上述代码中,min-date设置为当前时间,max-date设置为当前时间加一年。picker-options是可选的,用于设置快捷选择项。

element-ui中DateTimePicker 日期时间选择器单次最长可选择一年且当前时间之后和之前都可选代码怎么写

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

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