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 = ...
随机推荐
- python获取风和天气城市数据 ID
import requestsurl='https://cdn.heweather.com/china-city-list.csv'strhtml=requests.get(url)strhtml.e ...
- 为什么NtReadVirtualMemory 硬件断点无法下断
win7 x64为例 nt!NtReadVirtualMemory ----- nt!MmCopyVirtualMemory NTSTATUS NTAPI MmCopyVirtualMemory(IN ...
- Spring cloud微服务安全实战-3-13重构代码
让代码同时支持两种方式,登陆访问和带着请求头的token访问也可以. 首先做代码的重构 这里改成getSession() 改成这样以后会有一个问题,我用httpBasic登陆成功以后,我的用户信息放在 ...
- spring 通过注解装配Bean
使用注解的方式可以减少XML的配置,注解功能更为强大,它既能实现XML的功能,也提供了自动装配的功能,采用了自动装配后,程序员所需要做的决断就少了,更加有利于对程序的开发,这就是“约定优于配置”的开发 ...
- 将MySQL一张表的数据迁移到MongoDB数据库的Java代码示例
Java代码: package com.zifeiy.snowflake.handle.etl.mongodb; import java.sql.Connection; import java.sql ...
- 【Leetcode_easy】953. Verifying an Alien Dictionary
problem 953. Verifying an Alien Dictionary solution: class Solution { public: bool isAlienSorted(vec ...
- 【Leetcode_easy】872. Leaf-Similar Trees
problem 872. Leaf-Similar Trees 参考 1. Leetcode_easy_872. Leaf-Similar Trees; 完
- docker常用管理命令
本文只记录docker命令在大部分情境下的使用,如果想了解每一个选项的细节,请参考官方文档,这里只作为自己以后的备忘记录下来. 根据自己的理解,总的来说分为以下几种: 容器生命周期管理 — docke ...
- mysql 严格模式 Strict Mode
mysql 严格模式 Strict Mode 找到MySQL安装目录下的my.cnf(windows系统则是my.ini)文件 在sql_mode中加入STRICT_TRANS_TABLES则表示开启 ...
- 浅谈python反序列化漏洞
最近看到p神一篇讲python反序列化的文章,结合redis未授权访问组合漏洞,感觉在flask和redis的构架中比较常见,便记录下来. p神原文:https://www.leavesongs.co ...