el-element日期时间组件限制可选时间范围

javascript 复制代码
    <el-date-picker
        v-model="formData.meetingTime"
        type="datetime"
        value-format="yyyy-MM-dd HH:mm:ss"
        style="width: 100%"
        placeholder="请选择日期"
        clearable
        :picker-options="pickerOptions"
      >
      </el-date-picker>
javascript 复制代码
<script>
	export default {
		data(){
			return{
				//限制当前时间之前的不可选并且最大可选时间不能超过2028-12-31
				 pickerOptions: {
			        disabledDate(time) {
			          const maxDate = new Date('2028-12-31')
			          return time.getTime() > maxDate.getTime() || time.getTime() < new Date().getTime() - 86400000
			        },
			        selectableRange: (() => {   //这里是限制时分秒
			          let data = new Date()
			          let hour = data.getHours()
			          let minute = data.getMinutes()
			          let second = data.getSeconds()
			          return [`${hour}:${minute}:${second} - 23:59:59`]
			        })()
			      },
			}
        }
	}
<script>
相关推荐
爱分享的程序员12 分钟前
前端面试专栏-算法篇:18. 查找算法(二分查找、哈希查找)
前端·javascript·node.js
翻滚吧键盘17 分钟前
vue 条件渲染(v-if v-else-if v-else v-show)
前端·javascript·vue.js
vim怎么退出19 分钟前
万字长文带你了解微前端架构
前端·微服务·前端框架
你这个年龄怎么睡得着的19 分钟前
为什么 JavaScript 中 'str' 不是对象,却能调用方法?
前端·javascript·面试
Java水解21 分钟前
前端常用单位em/px/rem/vh/vm到底有什么区别?
前端
CAD老兵25 分钟前
Vite 如何借助 esbuild 实现极速 Dev Server 体验,并支持无 source map 的源码调试
前端
南屿im25 分钟前
JavaScript 手写实现防抖与节流:优化高频事件处理的利器
前端·javascript
Spider_Man26 分钟前
从零开始构建React天气应用:API集成与UI设计全指南 🌤️
前端·react.js
浩浩测试一下41 分钟前
渗透信息收集- Web应用漏洞与指纹信息收集以及情报收集
android·前端·安全·web安全·网络安全·安全架构
西陵1 小时前
Nx带来极致的前端开发体验——借助CDD&TDD开发提效
前端·javascript·架构