vue3 + elementPlus 日期时间选择器禁用未来及过去时间

javascript 复制代码
<el-date-picker
                v-model="form.jyTime"
                type="datetime"
                placeholder="请选择加油时间"
                format="YYYY/MM/DD HH:mm:ss"
                value-format="YYYY-MM-DD HH:mm:ss"
                :disabled-date="disabledDate"
            />

一、禁用未来时间

javascript 复制代码
/** 时间禁用 */
function disabledDate(time) {
  // 获取今天的日期和时间
  const today = new Date();
  // 如果选择的日期时间在今天之后,则禁用
  return time.getTime() > today.getTime();
}

即可禁用未来日期、时间选择

二、禁用今天之前(过去)的时间

javascript 复制代码
/** 时间禁用 */
function disabledDate(time) {
  // 获取今天的日期和时间(00:00:00)
  const todayStart = new Date(new Date().toLocaleDateString()).getTime();
  // 如果选择的日期时间在今天之前,则禁用
  return time.getTime() < todayStart;
}
相关推荐
我想学LINUX1 小时前
【2024年华为OD机试】 (C卷,100分)- 括号匹配(Java & JS & Python&C/C++)
java·c语言·javascript·c++·python·华为od
Cliven_4 小时前
TypeScript Jest 单元测试 搭建
javascript·typescript·单元测试
LCG元7 小时前
Vue.js组件开发-如何使用day.js、luxon或date-fns处理日期时间
vue.js
幸运小圣8 小时前
LeetCode热题100-合并两个有序链表【JavaScript讲解】
javascript·leetcode·链表
我想学LINUX8 小时前
【2024年华为OD机试】 (C卷,100分)- 消消乐游戏(Java & JS & Python&C/C++)
java·c语言·javascript·c++·游戏·华为od
ฅQSω[*邱╭8 小时前
写个自己的vue-cli
前端·javascript·vue.js·学习
阿芯爱编程9 小时前
typescript语法讲解
前端·javascript
Daniel_1879 小时前
Promise-课堂笔记
前端·javascript·笔记
一点一木9 小时前
TensorFlow.js 和 Brain.js 全面对比:哪款 JavaScript AI 库更适合你?
前端·javascript·人工智能
借来一夜星光11 小时前
【前端动效】原生js实现拖拽排课效果
前端·javascript·css3·html5