el-date-picker设置开始时间小于结束时间

一. date-picker Template

html 复制代码
<template>
	<el-form-item label="开始时间" prop="startDate">
	  <el-date-picker
		v-model.trim="form.startDate"
		type="datetime"
		placeholder="请选择日期"
		value-format="yyyy-MM-dd HH:mm:ss"
		:picker-options="startTime"
		:disabled="isDetail"
	  ></el-date-picker>
	</el-form-item>
	<el-form-item label="结束时间" prop="endDate">
	  <el-date-picker
		v-model.trim="form.endDate"
		type="datetime"
		placeholder="请选择日期"
		value-format="yyyy-MM-dd HH:mm:ss"
		:picker-options="endTime"
		:disabled="isDetail"
	  ></el-date-picker>
	</el-form-item>
</template>

二. script

javascript 复制代码
<script>
	export default {
		data() {
			return {
				startTime: {
					disabledDate: (time) => {
					  return this.disabledDateStart(time)
					}
				},
				endTime: {
					disabledDate: (time) => {
					  return this.disabledDateEnd(time)
					}
				}
			}
		},
		methods: {
			disabledDateStart (time) {
			  return (
				time.getTime() > new Date(this.form.endDate).getTime()
			  );
			},
			disabledDateEnd (time) {
			  return (
				time.getTime() < new Date(this.form.startDate).getTime()
			  );
			}
		}
	}
</script>
相关推荐
FYKJ_201021 分钟前
django药饮个性化推荐系统54839-计算机课程设计、毕业设计
vue.js·spring boot·python·mysql·typescript·spark·django
默_笙5 小时前
🚓 分诊台与拆题术:让 RAG 学会判断和规划
前端·javascript
呃呃呃呃ex6 小时前
10. 现代前端工程化:ES6 React 项目实战与原理解析
前端·javascript
浪遏6 小时前
D2C 系统架构复盘:从设计稿到代码,我们踩过的坑和最终方案
前端·javascript·后端
farerboy6 小时前
WEB 项目如何禁用 F12 等功能
前端·vue.js·架构
Blanche15006 小时前
Webpack 构建流程解析
javascript·面试
parade岁月6 小时前
vtable-guild 被收录进 vuejs/awesome-vue 了 🎉
前端·vue.js
Flynt6 小时前
官方说一个破折号拖慢整段高亮,我在 Node 里验证了一遍:机制是真的,2.8 倍没跑出来
javascript·性能优化·v8
默_笙6 小时前
🚗 把小说装进数据库了:我的第一个 RAG,和它的五个硬伤
前端·javascript
像我这样帅的人丶你还6 小时前
📱iPhone Duo 开屏动画咋实现的?
javascript·webgl·three.js