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;
}
相关推荐
Larcher1 天前
React Router 不只是页面跳转:从 SPA 路由到权限守卫的完整实践
javascript·后端
Larcher1 天前
大模型为什么每次回答都不一样?一文搞懂 Temperature、Top K 与 Top P
javascript·后端
eric-sjq1 天前
10 分钟实战:用 0.6B 本地模型生成中文网页(WanlyFrontend + 编译器全流程)
javascript·机器学习·自然语言处理·html
To_OC1 天前
LC 438 找到所有字母异位词:暴力超时后,我靠滑动窗口一招搞定
javascript·算法·leetcode
90后的晨仔1 天前
Mac 开发 uni-app 终极方案:让安卓模拟器彻底脱离 Android Studio 独立运行
前端·vue.js
kyriewen1 天前
面试官问"这段逻辑为什么这样写"——我才发现,这半年我写的代码,我自己都解释不了
前端·javascript·面试
一壶浊酒..1 天前
Scrape Webpack练习
开发语言·javascript·webpack
默_笙1 天前
⛵ 我用 React + TS 做了个"调色盘",顺便学会了企业级项目的目录架构
前端·javascript
渣波1 天前
拒绝 Redux 样板代码:Zustand 核心原理与实战进阶指南(基础、异步与切片模式)
前端·javascript
C++、Java和Python的菜鸟1 天前
第12章 前端Web进阶(Vue工程化+ElementPlus)
前端·javascript·vue.js