如何设置el-date-picker的默认截止时间为“23:59:59”

devtools/2024/11/13 15:02:25/

总结网上的方法,最好用的是最后一个

设置的关键是:default-time=“[‘00:00:00’, ‘23:59:59’]”

javascript">              <el-date-picker:default-time="['00:00:00', '23:59:59']"v-model="formData.dischargeTime"type="datetimerange"range-separator="至"start-placeholder="开始时间"end-placeholder="结束时间"value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>

有的人default-time前加冒号才可以,有的人不加才行,不知道为什么,但都可以试一试,但这两种方法对我无效。
我用的下边这种方法

javascript"><el-date-picker:default-time="defaultTimeFormat"v-model="selectedDate"type="datetimerange"value-format="yyyy-MM-dd HH:mm:ss"
/><script>
const defaultTimeFormat = computed(() => {const [start, end] = ["00:00:00", "23:59:59"].map(time => {const [hour, minute, second] = time.split(":").map(Number);return new Date(0, 0, 0, hour, minute, second);});const dateRange: [Date, Date] = [start, end]return dateRange;
});
</script>

效果如下
在这里插入图片描述
如果想取开始时间和截止时间

javascript"> <el-date-pickerv-model="selectedDate":default-time="defaultTimeFormat"size="small"type="datetimerange"start-placeholder="开始时间"end-placeholder="结束时间"format="YYYY-MM-DD HH:mm:ss"@change="handleDateChange"/>//时间选择器
// 存储选择的日期 `
const selectedDate = ref(null);
const start = ref("2024-10-01 9:00:00.00");
const end = ref("2024-11-07 11:00:00.00");
// 处理日期更改事件
const handleDateChange = (date) => {selectedDate.value = date;const date1 = new Date(selectedDate.value[0]);console.log(date1.getDate, 1234);const date2 = new Date(selectedDate.value[1]);const date11 = `${date1.getFullYear()}-${String(date1.getMonth() + 1).padStart(2, "0")}-${String(date1.getDate()).padStart(2, "0")} ${String(date1.getHours()).padStart(2, "0")}:${String(date1.getMinutes()).padStart(2, "0")}:${String(date1.getSeconds()).padStart(2, "0")}`;const date22 = `${date2.getFullYear()}-${String(date2.getMonth() + 1).padStart(2, "0")}-${String(date2.getDate()).padStart(2, "0")} ${String(date2.getHours()).padStart(2, "0")}:${String(date2.getMinutes()).padStart(2, "0")}:${String(date2.getSeconds()).padStart(2, "0")}`;start.value = date11 + ".000";end.value = date22 + ".000";console.log("选择的日期1111:", start.value, end.value);
};// 处理确认按钮点击事件
const confirmDate = () => {console.log("选择的日期:", selectedDate.value);if (selectedDate.value === null) {start.value = "2024-10-01 9:00:00.00";end.value = "2024-11-07 11:00:00.00";}allData1();
};

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

相关文章

labview连接sql server数据库

通常涉及到庞大的数据量时&#xff0c;我们会优先考虑sql server&#xff0c;他相对存储的数据会多一些&#xff0c;对于最近这个项目刚好可以用得到&#xff0c;下面我们来说一下关于labview连接sql server数据库。 首先是连接信息&#xff0c;和连接ACCESS数据库一样&#x…

1Panel修改PostgreSQL时区

需求 1Panel安装的PostgreSQL默认是UTC时区&#xff0c;需要将它修改为上海时间 步骤 进入PostgreSQL的安装目录 /opt/1panel/apps/postgresql/postgresql/data打开postgresql.conf文件 修改&#xff1a; log_timezone Asia/Shanghai timezone Asia/Shanghai保存后重启…

uniapp vuex的使用

实现组件全局&#xff08;数据&#xff09;管理的一种机制&#xff0c;可以方便的实现组件之间共享数据&#xff0c;不同于上述三种传递值的方式。 可以把vuex当成一个store仓库&#xff0c;可以集中管理共享的数据&#xff0c;并且存储在vuex中的数据都是响应式的&#xff0c…

自动化新时代:机器取代工作,我们该如何重塑自我?

内容概要 在自动化时代的浪潮中&#xff0c;技术的飞速发展对传统工作模式产生了深远影响。我们眼前浮现的是一个充满机遇与挑战的新世界。许多岗位面临被机器取代的威胁&#xff0c;然而&#xff0c;这一变化并不仅仅是消极的。在这个背景下&#xff0c;个体不仅需要重新审视…

机器学习(基础2)

特征工程 特征工程:就是对特征进行相关的处理 一般使用pandas来进行数据清洗和数据处理、使用sklearn来进行特征工程 特征工程是将任意数据(如文本或图像)转换为可用于机器学习的数字特征,比如:字典特征提取(特征离散化)、文本特征提取、图像特征提取。 特征工程API 实例化…

Scala的Map集合

Map 有两种类型&#xff0c;可变与不可变&#xff0c;区别在于可变对象可以修改它&#xff0c;而不可变对象不可以。 默认情况下 Scala 使用不可变 Map。如果你需要使用可变集合&#xff0c;你需要显式的引入 import scala.collection.mutable.Map 类 在 Scala 中 你可以同时…

Python实现PageRank算法

目录 第一部分:PageRank算法概述与原理1.1 什么是PageRank算法?1.2 PageRank算法的工作流程1.3 PageRank算法的时间复杂度第二部分:PageRank算法的Python实现(面向对象设计)2.1 Python类设计2.2 代码实现2.3 代码解释第三部分:案例1 - 动态网络中的PageRank计算(观察者模…

【网页设计】HTML5 和 CSS3 提高

目标 能够说出 3~5 个 HTML5 新增布局和表单标签能够说出 CSS3 的新增特性有哪些 1. HTML5 的新特性 注&#xff1a;该部分所有内容可参考菜鸟教程菜鸟教程 - 学的不仅是技术&#xff0c;更是梦想&#xff01; (runoob.com) HTML5 的新增特性主要是针对于以前的不足&#xf…