el-DatePicker 时间选择器设置可选择时间范围

最新推荐文章于 2024-03-29 16:25:25 发布

VYPS

最新推荐文章于 2024-03-29 16:25:25 发布

阅读量701

点赞数

分类专栏： element 文章标签： vue.js elementui 前端

本文链接：https://blog.csdn.net/m0_65930596/article/details/134345310

版权

element 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

可选择今天之前

<el-date-picker
          style="width: 100%"
          v-model="form.handleEndTime"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="选择处理时间"
          :picker-options="{
            disabledDate: (time) => {
                  return time.getTime() > Date.now() - 1 * 24 * 60 * 60 * 1000;
            }
          }"
        >
        </el-date-picker>

可选择指定日期之前

<el-date-picker
          style="width: 100%"
          v-model="form.handleEndTime"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="选择处理时间"
          :picker-options="{
            disabledDate: (time) => {
              return time.getTime() > new Date('2023-11-11') - 1 * 24 * 60 * 60 * 1000;
            }
          }"
        >
        </el-date-picker>

包含当天

<el-date-picker
          style="width: 100%"
          v-model="form.handleEndTime"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="选择处理时间"
          :picker-options="{
            disabledDate: (time) => {
                  return time.getTime() > Date.now() ;
            }
          }"
        >
        </el-date-picker>

当天之后

<el-date-picker
          style="width: 100%"
          v-model="form.handleEndTime"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="选择处理时间"
          :picker-options="{
            disabledDate: (time) => {
                  return time.getTime() < Date.now() - 1 * 24 * 60 * 60 * 1000;
            }
          }"
        >
        </el-date-picker>