el-date-picker时间控制范围为过去时间不可选

<el-date-picker :picker-options="startPickerOptions()" value-format="yyyy-MM-dd HH:mm:ss" v-model="form.applyFixPlan" type="datetime" placeholder="选择日期时间">
</el-date-picker>

在method中定义startPickerOptions()
this.$dayjs是Day.js的封装
​​​​​​​Day.js中文网

一天的毫秒数为 24*3600*1000= 86400000 = 8.64*10的7次方 = 8.64e7
获取今日之前的日期- 用于今日(包含今日)日期之后不可选限制     

Date.now() - 8.64e7
今日(不含今日)之后日期不可选
​​​​​​​Date.now() - 8.64e6

    startPickerOptions () {if (this.form.applyFixPlan != undefined) {let dateYMD = this.$dayjs(this.form.applyFixPlan).format('YYYY-MM-DD')let dateNow = this.$dayjs().format('YYYY-MM-DD')let dateHMS = this.$dayjs().format('HH:mm:ss')let pickerDate = dateYMD === dateNowreturn {//因为在选新日期的时候被禁用的时间没有更新,需要手动给赋值selectableRange: pickerDate? dateHMS + ' - 23:59:59' : '00:00:00 - 23:59:59',disabledDate: (time) => {//过去时间不可选return time.getTime() < Date.now() - 8.64e7;}}} else {// 初始默认 过去时间不可选return {disabledDate: (time) => {return time.getTime() < Date.now() - 8.64e7;}}}},

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/198655.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

c++ 三目运算符在类中的使用

简介 在类比较方面&#xff0c;三目运算符可以用于重载比较运算符。 代码示例1 #include <iostream> #include <cstring>class Person { public:Person(const char* name, int age) : m_age(age) {m_name new char[strlen(name) 1];strcpy(m_name, name);}~Pe…

SiR-NHS酯偶联物:用于细胞过程定量分析 星戈瑞

SiR-NHS酯**(源自星戈瑞的花菁染料)**染料的偶联物通常被用于细胞过程的定量分析&#xff0c;这些偶联物是通过将SiR-NHS酯染料与特定的生物分子或分子结构结合而制备的。这些偶联物可用于定量分析细胞内的不同过程&#xff0c;例如蛋白质的定位、分布、表达水平等。以下是一些…

HNU-电路与电子学-未知年份(不含解析)

【写在前面】 电路与电子学好像是从2020级开设的课程&#xff0c;故实际上目前只有2020与2021两个年级考过期末考试。 这门课程主要由所谓的“数电”与“模电”组成。而且先学的“模电”后学的“”数电&#xff0c;故期中考试主要以“模电”为主&#xff0c;期末考试主要以“…

前端vue导出PPT幻灯片,使用pptxgen.js,超详细(赋原数据)

即上一篇文章最终代码 前端vue导出PPT&#xff0c;使用pptxgen.js 前端vue导出PPT&#xff0c;使用pptxgen.js 一个平台下有10个国家&#xff0c;这个是后端返回数据固定的&#xff0c;每一个国家下面有10个物流方式&#xff0c;这10个物流方式是这10个国家都有的&#xff0c;…

Nexus Repository Manager的应用【转载】

©著作权归作者所有&#xff1a;来自51CTO博客作者mybabe0312的原创作品&#xff0c;请联系作者获取转载授权&#xff0c;否则将追究法律责任 Nexus Repository Manager的应用 转载地址&#xff1a;https://blog.51cto.com/dengshuangfu/2454961 安装和运行Nexus Reposito…

PTA 7-236 验证哥德巴赫猜想

哥德巴赫猜想之一是指一个偶数&#xff08;2除外&#xff09;可以拆分为两个素数之和。请验证这个猜想。 因为同一个偶数可能可以拆分为不同的素数对之和&#xff0c;这里要求结果素数对彼此最接近。 输入格式: 首先输入一个正整数T&#xff0c;表示测试数据的组数&#xff0…

java FTP客户端获取文件流假死问题

依赖 hutool FTP配置 inspection.data.ftp.host172.26.1.41 inspection.data.ftp.port21 inspection.data.ftp.user6c inspection.data.ftp.password6cqq123 inspection.data.ftp.charsetNameGBK FTP配置类 import lombok.Data; import org.springframework.boot.context.pr…

redis配置介绍

redis配置详解 一、redis.conf二、持久化1、RDB① 触发机制② 优缺点③ 恢复rdb 2、AOF① 优缺点② 恢复aof 三、发布订阅 一、redis.conf # -----NETWORK----- # 设置绑定ip bind 127.0.0.1 -::1 # 设置redis保护&#xff0c;只能通过绑定在本地回环地址上的网络接口进行访问…

javaweb校车校园车辆管理系统springboot+jsp

结构设计&#xff1a;总体采用B/S结构设计模式 (1)用户登录模块&#xff1a;用户通过手动登录&#xff0c;检测是否是校内人员的车辆。 (2)用户车辆信息编辑、上传、模块&#xff1a;通过上传车辆入场信息的操作权限&#xff0c;以用户的名义发布资料上传至校园停车场系统中。…

在eclipse中安装python插件:PyDev

在eclipse中安装插件PyDev&#xff0c;就可以在eclipse中开发python了。 PyDev的官网&#xff1a;https://www.pydev.org/ 不过可以直接在eclipse中用Marketplace安装&#xff08;备注&#xff1a;有可能一次安装不成功&#xff0c;是因为下载太慢了&#xff0c;多试几次&…

3、RocketMQ源码分析(三)

RocketMQ源码-NameServer架构设计及启动流程 本文我们来分析NameServer相关代码&#xff0c;在正式分析源码前&#xff0c;我们先来回忆下NameServer的功能&#xff1a; NameServer是一个非常简单的Topic路由注册中心&#xff0c;其角色类似Dubbo中的zookeeper&#xff0c;支…

【AXI死锁】

单主机单从机死锁 AXI4没有WID,所以比较严格,即写数据通道的数据必须严格的按照写地址通道的数据顺序传送,比如AW通道发送ADDR0,ADDR1,ADDR2三笔写操作,每个写操作burst length=2,那么W通道的顺序在AXI4协议的规定下必须为:WDATA0_0,WDATA0_1,WDATA1_0,WDATA1_1,WDATA2_0…

Jdk1.8日期类(LocalDate、LocalTime、LocalDateTime)

Jdk1.8新增三大日期常量类&#xff0c;与String类相同都是通过final来修饰&#xff0c;线程安全。 LocalDate&#xff1a;表示日期&#xff08;年月日&#xff09; LocalTime &#xff1a;表示时间&#xff08;时分秒&#xff09; LocalDateTime&#xff1a;表示时间 日期 &…

将两个有序顺序表合并为一个新的有序顺序表,并由函数返回结果顺序表。

题目描述&#xff1a;将两个有序顺序表合并为一个新的有序顺序表&#xff0c;并由函数返回结果顺序表。 SqList Merge(SqList A, SqList B) {SqList C; // 定义新的有序顺序表C&#xff0c;用于存储合并后的结果C.length 0; // 初始化C的长度为0int i 0; // 指针i用于遍历顺…

LeetCode刷题---两两交换链表中的节点

个人主页&#xff1a;元清加油_【C】,【C语言】,【数据结构与算法】-CSDN博客 个人专栏&#xff1a;http://t.csdnimg.cn/D9LVS 前言&#xff1a;这个专栏主要讲述递归递归、搜索与回溯算法&#xff0c;所以下面题目主要也是这些算法做的 我讲述题目会把讲解部分分为3个部分…

dubbo框架技术文档-《spring-boot整合dubbo框架搭建+配置文件》框架的本地基础搭建

阿丹&#xff1a; 目前流行的微服务更多的就是dubbo和springcould微服务。之前阿丹没有出过dubbo相关的文章&#xff0c;因为之前接触springcould的微服务概念比较多一点&#xff0c;但是相对于springcould来说&#xff0c;springcould服务之间的调用是大多是使用了nacos&#…

每日一题:LeetCode-75. 颜色分类

每日一题系列&#xff08;day 12&#xff09; 前言&#xff1a; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f50e…

黑马头条数据管理平台项目总结

今天主要看了该项目的介绍&#xff0c;这个黑马头条数据管理平台项目主要包括登录、用户的权限判断、文章内容列表的筛选和分页、文章的增删查改还有图片和富文本编辑器这几大部分组成&#xff0c;项目配套了素材代码&#xff0c;像资源文件、第三方插件、页面文件夹、工具插件…

Vue基础知识点梳理总结归纳

在Vue中,被用来响应地更新HTML属性的指令是v-model页面挂载成功之后会触发哪一个钩子函数mounted挂载之后会进行页面的渲染v-on是动作元素不属于条件渲染指令在Vue中,下列关于Vue实例对象说法不正确的是()。A.Vue实例对象是通过new Vue({})方式创建的。B.Vue实例对象只允许…

Python中PyQt5可视化界面通过拖拽来上传文件

注&#xff1a;这个窗口提供了一个快速上传文件的小tips&#xff0c;如果需要对上传的文件进行进一步处理的可以在“processFiles”函数或者编写其它函数进行扩充就可以。 1、需要安装模块 pip install PyQt5 2、运行效果 1、通过拖拽的方式上传需要的文件到窗口&#xff0c;会…