elementui限制开始日期和结束日期
项目需求:开始日期和结束日期 禁用当前日期之前的日期。同时结束日期 禁用开始日期之前的日期
<div class='startTime'>
开始时间:<el-date-picker v-model="value1" type="date" @change="changeStartTime" :clearable="false"
placeholder="选择日期" :picker-options="startDateLimit">
</el-date-picker>
<span class="important">*</span>
</div>
<!-- 结束时间 -->
<div class="endTime">
结束时间:<el-date-picker v-model="value2" :picker-options="endDateLimit" type="date" :clearable="false" @change="changeEndTime" placeholder="选择日期">
</el-date-picker>
<span class="important">*</span>
</div>
vm = new Vue({
el: "#app",
data: function () {
return {
value1: "", //开始时间
value2: "", //结束时间
startDateLimit: {
disabledDate: (time) => {
// if (this.value2 != "") {
// return time.getTime() > new Date(this.value2).getTime();
// }else{
return time.getTime() < Date.now() - 8.64e7;//禁用当前日期之前的时间;如果没有后面的-8.64e6就是不可以选择今天的
// }
}
},
endDateLimit: {
disabledDate: (time) => {
if(this.value1!= ""){
return time.getTime() < new Date(this.value1).getTime()//禁用开始日期之前的日期
}
return time.getTime() < Date.now() - 8.64e7;; //减去一天的时间代表可以选择同一天;
}
},
}
},
更多使用方法链接如下:
https://blog.csdn.net/qq_33769914/article/details/83856268
https://www.cnblogs.com/YuKiee/p/9651240.html
elementui限制开始日期和结束日期的更多相关文章
- PHP计算一年有多少周,每周开始日期和结束日期
一年有多个周,每周的开始日期和结束日期 参考代码一:[正在使用的版本] <?php header("Content-type:text/html;charset=utf-8" ...
- PHP获取一年有几周以及每周开始日期和结束日期
最近接了一个项目,其中有一需求是用php获取一年有几周以及每周开始日期和接触日期.在网上找些资料没有合适的,于是自己做了一份,下面通过两种方式实现PHP获取一年有几周以及每周开始日期和结束日期 代码一 ...
- MySql开始日期、结束日期查询
str_to_date('2016-08-24', '%Y-%m-%d %H') validStartTime str_to_date('2016-09-16', '%Y-%m-%d %H') val ...
- javascript控制开始日期,和结束日期在同一个月
/* * 控制开始日期,和结束日期 * 开始日期为当前月份,结束日期为当天 * 开始日期为之前月份,结束日期为最后一天 * @return string * @poseidon 2015-9-17 * ...
- PHP获取某年第几周的开始日期和结束日期
http://blog.csdn.net/qq_27080247/article/details/50835956 /** * 获取某年第几周的开始日期和结束日期 * @param int $year ...
- PHP:获取指定日期所在月的开始日期与结束日期
/** * 获取指定日期所在月的开始日期与结束日期 * @param string $date * @param boolean 为true返回开始日期,否则返回结束日期 * @return arra ...
- my97datepicker开始日期小于结束日期格式化时间精确届时分秒
my97datepicker开始日期小于结束日期格式化时间精确到时分秒 一 , 需求: 结束时间 > 开始时间, 不符合的时间段不能选择.比如我选择开始日期是7月28,那结束的日期将只能从7月2 ...
- EasyUI-datebox设置开始日期小于结束日期,并且结束日期小于当前日期
datebox设置开始日期小于结束日期,并且结束日期小于当前日期 //日期控制扩展选择日期小于等于当前日期,开始日期小于等于结束日期 $("#datebox1").datebox( ...
- JS获取本周、本季度、本月、上月的开始日期、结束日期
/** * 获取本周.本季度.本月.上月的开始日期.结束日期 */ var now = new Date(); //当前日期 var nowDayOfWeek = ...
随机推荐
- 【转载】 卷积神经网络(Convolutional Neural Network,CNN)
作者:wuliytTaotao 出处:https://www.cnblogs.com/wuliytTaotao/ 本作品采用知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议进行许可,欢迎 ...
- 我的一个PLSQL函数 先查询再插入数据库的函数 动态SQL拼接查询条件、通用游标、记录定义(封装部分查询字段并赋值给游标)、insert select 序列、常量【我】
先查询再插入数据库的函数 CREATE OR REPLACE FUNCTION F_REVENUE_SI(l_p_cd in Varchar2, l_c_cd in Varchar2, l_prod_ ...
- Django ORM的继承关系
ORM中通常将对象引用映射到外键,但是对于继承,关系数据库中没有自然有效的方法来对应.从数据存储的角度来看,在映射继承关系时,可以采用几种方式(参考JPA中的InheritanceType.定义): ...
- 报错:(未解决)java.lang.VerifyError: Instruction type does not match stack map
报错背景: CDH中集成kafka的服务,解决完kafka的jar包报错之后重启,发现这个报错. 报错现象: java.lang.VerifyError: Instruction type does ...
- build时自动清除console
一.第一种方法 安装 babel-plugin-transform-remove-console 修改 babel.config.js 文件 let transformRemoveConsolePlu ...
- Docker之使用Docker-compose搭建LNMP环境
之前有随笔介绍使用Docker-compose搭建LNMP环境(centos6 php5.6) https://www.cnblogs.com/minseo/p/10146982.html 本文介绍D ...
- 什么时候该用readfile() , fread(), file_get_contents(), fgets()?
fread() 和 readfile() fread() 最大一次性能读取 8k长度的字节数,所以不能一次性读取大文件去作下载. 优势在于,操作更加灵活,每次读取指定字节的内容,用于下载时方便控制服务 ...
- 【嵌入式硬件Esp32】(1)例程Hello World Example 注释
/* Hello World Example This example code is in the Public Domain (or CC0 licensed, at your option.) ...
- CF1227D Optimal Subsequences
思路: 首先对于单个查询(k, p)来说,答案一定是a数组中的前k大数.如果第k大的数字有多个怎么办?取索引最小的若干个.所以我们只需对a数组按照值降序,索引升序排序即可. 多个查询怎么办?离线处理. ...
- OneNote中更改英文输入默认不是微软雅黑的问题
win10下的终极版解决方案: 1.进入C:\Windows\Fonts找到Calibri字体,点进去后先右键Calibri常规-属性-安全-高级,将所有者从“TrustedInstaller”更改为 ...