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;
}
相关推荐
zzzzzz31034 分钟前
看 react-bits,不要只看“酷炫”:一套阅读动画交互组件库的框架
javascript·react.js·动效
香芋芋圆8 小时前
AI 冲击内卷之下,普通前端如何破局?WebGIS—— 低门槛突围赛道
前端·javascript·人工智能·学习·职场发展
INS_KF9 小时前
【编程笔记】成员函数中两个 const 的区别(const Data &getData() const;)
前端·javascript·笔记
宿6749 小时前
vue3-async
前端·javascript·vue.js
excel11 小时前
Nuxt + Twin CSS 中宽度超过屏幕时底部出现空白的原因与解决方案
前端·javascript
一个游离的指针13 小时前
函数管道:消除深度嵌套调用
前端·javascript
柚yuzumi14 小时前
前端优化,从少触发一次开始:防抖与节流
前端·javascript
默_笙14 小时前
🚤 CSS 布局的"圈地运动":BFC 就是浏览器的独立领地
前端·javascript
用户9385156350715 小时前
大模型记忆指南:从短时缓存到永久记忆,手把手带你吃透 LangChain Memory 管理
javascript·人工智能
xqchen15 小时前
Web Components 普及困境深度解析:技术标准与工程实践的落差
javascript