el-date-picker 开始时间选定后,结束时间不可选择开始时间之前的日期

javascript 复制代码
<el-date-picker
            v-model="startTime"
            name="startTime"
            value-format="yyyy-MM-dd"
            type="date"
            @change="activityStartTime"
            placeholder="请选择开始日期"
            :picker-options="pickerOptions"
          />
<el-date-picker
            v-model="endTime"
            name="endTime"
            value-format="yyyy-MM-dd"
            type="date"
            @change="activityEndTime"
            placeholder="请选择结束日期"
            :picker-options="pickerOptions1"
          />

data(){
	return{
		startTime:new Date(new Date - 1000*60*60*24*31),toLocaleDateString().split('/').map(item=>{if(item<10){return '0'+item}else{return item}}).join('-'),
		endTime:new Date().toLocaleDateString().split('/').map(item=>{if(item<10){return '0'+item}else{return item}}).join('-'),
		pickerOptions:{},
		pickerOptions1:{}
	}
}

activityStartTime(val){
	this.pickerOptions1 = Object.assign({}, this.pickerOptions,{
		disabledDate: time => {
			return (
				new Date(time).getTime() <= new Date(this.startTime)
			)
		}
	})
}

activityEndTime(val){
	if(!value){
		this.pickerOptions = Object.assign({}, this.pickerOptions1,{
			disabledDate: time => {
				return time.getTime() >= new Date("2999-12-30 23:59:59").getTime();
			}
		})
		return
	}

	this.pickerOptions = Object.assign({}, this.pickerOptions1,{
		disabledDate: time => {
			return (
				time.getTime() >
				new Date(this.endTime).getTime() - 24*3600*1000
			)
		}
	})
}

参考:

1、el-date-picker中日期选择器时间限制,限制选择30天时间范围且不大于当前时间 ; 时间范围只能选择1天;时间范围在某一段时间内

2、el-date-picker日期的限制

相关推荐
谷歌开发者41 分钟前
Web 开发指向标 | Chrome 开发者工具学习资源 (一)
前端·chrome·学习
名字越长技术越强1 小时前
Chrome和IE获取本机ip地址
前端
天***88961 小时前
Chrome 安装失败且提示“无可用的更新” 或 “与服务器的连接意外终止”,Chrome 离线版下载安装教程
前端·chrome
半梦半醒*1 小时前
zabbix安装
linux·运维·前端·网络·zabbix
清羽_ls1 小时前
React Hooks 核心规则&自定义 Hooks
前端·react.js·hooks
你的人类朋友1 小时前
“签名”这个概念是非对称加密独有的吗?
前端·后端·安全
西陵2 小时前
Nx带来极致的前端开发体验——任务缓存
前端·javascript·架构
10年前端老司机3 小时前
Promise 常见面试题(持续更新中)
前端·javascript
潘小安3 小时前
跟着 AI 学 (一)- shell 脚本
前端·ci/cd·vibecoding
clownAdam4 小时前
Chrome性能优化秘籍
前端·chrome·性能优化