Vue 中使用 el-date-picker 限制只能选择当天、当天之前或当天之后日期的方法详解

devtools/2024/10/18 18:22:58/

网上很多都是不完整的,我这里发布一个完整的

- 8.64e7 表示可选择当天时间(注:小于当前时间,- 8.64e7 则是禁用日期不包含当前日,若大于当前日期, 8.64e7 则是禁用日期包含当前日)

time.getTime() < Date.now() - 8.64e7  禁用日期不包含当前日

time.getTime() > Date.now() - 8.64e7  禁用日期包含当前日

1.只能选择当日

javascript"><el-date-pickerformat="yyyy 年 MM 月 dd 日"value-format="yyyy-MM-dd"v-model="ruleForm.shenqingshijian"type="date":picker-options="pickerOptions"placeholder="申请时间">
</el-date-picker><script>
export default {data() {return {selectedDate: null,pickerOptions: { disabledDate(time) { return time.getTime() > Date.now() || (time.getTime() < Date.now() - 8.64e7); }, },};},
};
</script>


2.限制只能选择当天之前的日期                        

javascript"><template><div><el-date-pickerv-model="selectedDate":picker-options="pickerOptions"></el-date-picker></div>
</template><script>
export default {data() {return {selectedDate: null,pickerOptions: {disabledDate(time) {return time.getTime() > Date.now();},},};},
};
</script>

3.限制只能选择当天之后的日期

javascript"><template><div><el-date-pickerv-model="selectedDate":picker-options="pickerOptions"></el-date-picker></div>
</template><script>
export default {data() {return {selectedDate: null,pickerOptions: {disabledDate(time) {return time.getTime() < Date.now();},},};},
};
</script>


http://www.ppmy.cn/devtools/41998.html

相关文章

Mysql面试高频问题

MySQL中&#xff0c;如何定位慢查询? 可以部署运维的监控系统Skywalking &#xff0c;在展示的报表中可以看到是哪一个接口比较慢&#xff0c;并且可以分析这个接口哪部分比较慢&#xff0c;这里可以看到SQL的具体的执行时间&#xff0c;所以可以定位是哪个sql出了问题如果&a…

网页转长图插件html2canvas【前端】

网页转长图插件html2canvas【前端】 前言版权开源推荐网页转长图插件html2canvas【前端】wkImageStorage流程使用后端application.propertiesWkConfigShareControllerImageCleanupTask 前端html2canvas.jsshare.htmlshare.jsgetShare.jsgetShare.html 最后 前言 2024-5-10 18:…

Qwen 开源标杆

Qwen的博客 在线体验Qwen开源版本、非常丝滑 不算量化、已经开源的Qwen1.5 版本有9个&#xff1a; 0.5B、1.8B、4B、7B、14B、32B、72B、110B、MoE-A2.7B 闭源已经发展到 Qwen-Max-0428、网页端从2.1升级到2.5 Qwen API详情 一些记录&#xff1a; 1、Qwen1.5 110B&#x…

Spacy的安装与使用教程

官网安装指导教程 https://spacy.io/usage 安装指令 需要根据自己系统的cuda版本选择 nvcc -V pip install -U pip setuptools wheel pip install -U spacy[cuda12x] python -m spacy download zh_core_web_sm python -m spacy download en_core_web_sm

【JavaEE】Maven简介与实用指南:项目构建和依赖管理的高效工具

目录 Maven什么是 Maven为什么学 Maven创建一个Maven项目依赖传递依赖排除 Maven 仓库本地仓库中央仓库私服 Maven设置国内源配置当前项⽬setting设置新项⽬的setting Maven 什么是 Maven 官⽅对于 Maven 的描述: Maven 是⼀个项⽬管理⼯具。基于 POM(Project Object Model,…

MySQL 数据库中 Insert 语句的锁机制

在数据库系统中&#xff0c;Insert 语句是常用的操作之一&#xff0c;用于向数据库表中插入新的数据记录。然而&#xff0c;当多个会话&#xff08;或者线程&#xff09;同时对同一张表执行 Insert 操作时&#xff0c;可能会引发一些并发控制的问题&#xff0c;特别是涉及到锁的…

JumpServer堡垒机应用(v3.10.8) 下

目录 JumpServer堡垒机简单式部署与管理(v3.10.8) 上-CSDN博客 一. 资产管理 1.1创建资产 1.2 给资产主机创建用户 1.2.1 普通账户&#xff1a; 1.2.2 特权账户&#xff1a; 1.2.3 创建用户 二. 命令过滤 2.1 创建命令组 2.2 创建命令过滤 ​编辑 三. 创建资产授权 …

254 基于matlab的钢筋混凝土非线性分析

基于matlab的钢筋混凝土非线性分析&#xff0c;根据梁本构关系&#xff0c;然后进行非线性分析&#xff0c;绘制弯矩-曲率曲线。可设置梁的截面尺寸、混凝土本构&#xff0c;钢筋截面面积等相关参数&#xff0c;程序已调通&#xff0c;可直接运行。 254 钢筋混凝土非线性分析 弯…