elementui中日期/时间的禁用处理,使用传值的方式

devtools/2024/10/18 17:29:23/

项目中,经常会用到  在一个学年或者一个学期或者某一个时间段需要做的某件事情,则我们需要在创建这个事件的时候,需要设置一定的时间周期,那这个时间周期就需要给一定的限制处理,避免用户的误操作,优化用户体验

如下:需求为,在选择学年后,学期的设置需要在学年中,且结束时间大于开始时间

javascript">data() {return {pickerOptionsStartTimes: function (entDate) {//学期开始日期 禁用处理let entTimes = entDatereturn {disabledDate: time => {//开始年1月1日 之后的时间time.getTime() < new Date(this.ruleForm.beginYear, 0, 1).getTime()//结束年12月31日之前的时间 time.getTime() > new Date(this.ruleForm.endYear, 11, 31).getTime()if (entTimes) {//选择 开始年1月1日-结束时间  期间的时间return time.getTime() < new Date(this.ruleForm.beginYear, 0, 1).getTime() || time.getTime() > new Date(entTimes).getTime()} else {//选择 开始年1月1日-结束年12月31日return time.getTime() < new Date(this.ruleForm.beginYear, 0, 1).getTime() || time.getTime() > new Date(this.ruleForm.endYear, 11, 31).getTime()}},}},pickerOptionsEndTimes: function (startDate) {//学期结束日期 禁用处理let beginDate = startDatereturn {disabledDate: time => {if (beginDate) {//选择 开始时间-结束年12月31日前 的时间return time.getTime() < new Date(beginDate).getTime() || time.getTime() > new Date(this.ruleForm.endYear, 11, 31).getTime()} else {//选择 开始年1月1日-结束年12月31日return time.getTime() < new Date(this.ruleForm.beginYear, 0, 1).getTime() || time.getTime() > new Date(this.ruleForm.endYear, 11, 31).getTime();}},}},
}
}

因为我这个页面的需求是,学期管理是可以动态添加/删除的 所以需要用传值的方式 实现当前学期的起始时间设置


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

相关文章

【Rust基础入门】Hello Cargo

文章目录 前言Cargo是什么&#xff1f;Cargo的作用查看cargo版本使用cargo创建项目Cargo.toml文件cargo build命令cargo runcargo check为发布构建 总结 前言 在Rust编程中&#xff0c;Cargo扮演着至关重要的角色。它是Rust的包管理器&#xff0c;负责处理许多任务&#xff0c…

论文辅助笔记:ST-LLM

1 时间嵌入 2 PFA&#xff08;Partial Frozen Architecture&#xff09; 3 ST_LLM 3.1 初始化 3.2 forward

three.js实现3D模型任意方向旋转

因为业务需要&#xff0c;我们在公司官网使用Three.js实现了可鼠标拖动任意旋转的3D旋转模型&#xff0c;可是实现之后发现除了Z轴方向都可以任意旋转&#xff0c;但是Z轴方向最多只能旋转180度。找遍全网也没有找到相关的资料来解释错在了哪一步&#xff0c;最终还是在github仓…

vue3+vite搭建第一个cesium项目详细步骤及环境配置(附源码)

文章目录 1.创建vuevite项目2.安装 Cesium2.1 安装cesium2.2 安装vite-plugin-cesium插件&#xff08;非必选&#xff09;2.3 新建组件页面map.vue2.4 加载地图 3.完成效果图 1.创建vuevite项目 打开cmd窗口执行以下命令&#xff1a;cesium-vue-app是你的项目名称 npm create…

唤醒知识循环,共筑绿色阅读梦——探索旧书回收小程序的无限可能

在这个信息爆炸的时代&#xff0c;书籍作为知识与智慧的载体&#xff0c;其重要性不言而喻。然而&#xff0c;随着电子阅读的兴起和书籍更新换代的加速&#xff0c;大量旧书被束之高阁&#xff0c;甚至面临被遗弃的命运。这不仅是对宝贵文化资源的浪费&#xff0c;也是对环境保…

vscode 快捷键

Visual Studio Code 快捷键大全&#xff08;最全&#xff09;-CSDN博客

C++:申明Declaration与定义Definition的本质与区别

在C中&#xff0c;声明和定义是两个不同的概念。 声明&#xff08;Declaration&#xff09; 声明是告诉编译器关于变量、函数等的存在以及它们的类型&#xff0c;但并不提供实际的存储空间或函数体。例如&#xff0c;你可以在程序的不同位置声明一个函数或者类&#xff0c;以…

第一次面试的经历(java开发实习生)

面试官的问题 我想问一下你这边有做过什么项目吗?你方便讲一下你做过的那些项目吗&#xff0c;用了什么技术栈&#xff0c;包括你负责开发的内容是什么&#xff1f;&#xff08;项目经验&#xff09;八大基本数据类型是什么&#xff1f;&#xff08;基础&#xff09;你说一下…