如何设置el-date-picker的默认截止时间为“23:59:59”
总结网上的方法,最好用的是最后一个
设置的关键是:default-time=“[‘00:00:00’, ‘23:59:59’]”
<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前加冒号才可以,有的人不加才行,不知道为什么,但都可以试一试,但这两种方法对我无效。
我用的下边这种方法
<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>
效果如下
如果想取开始时间和截止时间
<el-date-picker
v-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();
};
原文地址:https://blog.csdn.net/qq_43592674/article/details/143624598
免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!