使用elementUI的日期选择框,两选择框关联时间限值
elementui 本身也提供了在一个输入框内关联选择时间的组件,非常好使,但无奈项目需要用两个输入框去关联的选择:
<el-date-picker
class="datepicker"
size="mini"//尺寸
v-model="startTimed"
type="date"//日期类型
value-format="timestamp"//日期返回的时间格式,时间戳
:picker-options="start_date"//主要的功能,设置时间范围设定
placeholder="选择开始日期">
</el-date-picker>
<span style="display: inline-block;width: 40px;font-size: 12px;text-align: center;">——</span>
<el-date-picker
class="datepicker"
size="mini"
v-model="endTimed"
type="date"
value-format="timestamp"
:picker-options="end_date"
placeholder="选择结束日期">
</el-date-picker>
在data里面:
startTimed: "",//开始时间
endTimed:"",//结束时间
start_date:{//开始时间范围限定
disabledDate:time => {
if(this.endTimed) {
return time.getTime() > Date.now()-8.64e7 || time.getTime() >= this.endTimed;
}
return time.getTime() > Date.now()-8.64e7;
}
},
end_date:{//结束时间范围限定
disabledDate:time => {
return time.getTime() >= Date.now()-8.64e6 || time.getTime() <= this.startTimed;
}
},
//主要是disabledDate的取值,返回值;
//注意8.64e7和8.64e6的区别,后面的包括了当前的一天;
使用elementUI的日期选择框,两选择框关联时间限值的更多相关文章
- ElementUI DatePicker 日期选择器控制选择时间范围
选择今天以及今天之后的日期 <el-date-picker v-model="value1" type="date" placeholder=" ...
- 日期选择时两个日期之间的动态控制--My97datepicker日期选择控件
实现效果:如果先选离店日期,再选入住日期的话,入住日期大于离店日期则离店日期+1天否则离店日期不变,先选入店再选离店离店,离店只能选之后的日期,且两个日期之间最多间隔88天 <div class ...
- elementUI实现日期框选中项文本高亮
{ margin: 0; font: 12px "Helvetica Neue" } p.p2 { margin: 0; font: 12px "PingFang SC& ...
- Android UI(五)云通讯录项目之联系人列表,带侧滑选择,带搜索框
作者:泥沙砖瓦浆木匠网站:http://blog.csdn.net/jeffli1993个人签名:打算起手不凡写出鸿篇巨作的人,往往坚持不了完成第一章节.交流QQ群:[编程之美 365234583]h ...
- pandas处理时间序列(2):DatetimeIndex、索引和选择、含有重复索引的时间序列、日期范围与频率和移位、时间区间和区间算术
一.时间序列基础 1. 时间戳索引DatetimeIndex 生成20个DatetimeIndex from datetime import datetime dates = pd.date_rang ...
- jQuery实现列表框双向选择操作
对列表框的操作经常碰到过这样的应用:从左侧的列表框中选中要选的项添加到右侧列表框中,然后提交最终选择的项,对误操作而选中的项还可以执行移除操作.在很多系统中应用比如说求职网站的选择意向工作地区,QQ好 ...
- 使用Ajax获取多选框用户选择的值问题
目录 说明 正文 说明 在web开发过程中,将多选框的值提交到django后台,有两种提交方式: form表单提交 ajax异步提交 我需要使用ajax将复选框的值提交到后台,记录一下当时碰到的问题 ...
- 利用js取到下拉框中选择的值
现在的需求是:下拉框中要是选择加盟商让其继续选择学校,要是选择平台管理员则不需要选择学校.隐藏选择下拉列表. 选择枚举值: /// <summary> /// 平台角色 /// </ ...
- [原] XAF 添加日期筛选下拉选择
1.ListView 添加日期筛选下拉选择,选择指定,可指定日期范围 2.Code using DevExpress.Data.Filtering; using DevExpress.ExpressA ...
随机推荐
- puppet5.1 安装与配置
一.Puppet概念 简介 当服务器数量达到一定的规模时,仅依靠人为完成批量部署服务器个资源的配置,运维工作将变得繁琐且容易出错,为了解决这一问题,我们应该怎么办呢?我们可以引入一批工具,这批工具可编 ...
- Nacos 安装(带视频)
疯狂创客圈 Java 高并发[ 亿级流量聊天室实战]实战系列 [博客园总入口 ] 架构师成长+面试必备之 高并发基础书籍 [Netty Zookeeper Redis 高并发实战 ] 疯狂创客圈 高并 ...
- Hive concat函数连接后结果为null
Hive concat函数连接后结果为null concat函数是用来连接字符串的 使用示例: select concat('Hello','World','Java'); 运行结果: 最近我们在做需 ...
- WebShell代码分析溯源(十)
WebShell代码分析溯源(十) 一.一句话变形马样本 <?php $e = $_REQUEST['e'];register_shutdown_function($e, $_REQUEST[' ...
- 关于c# winform 键盘响应右边键盘消息响应事件的上下左右方向键没有反应
原文作者:aircraft 原文链接:https://www.cnblogs.com/DOMLX/p/11835642.html 记录一下这个小坑,c# winform 键盘响应右边键盘的上下左右方向 ...
- JS---DOM---点击操作---part2---14个案例
案例1:点击按钮禁用文本框 <input type="button" value="禁用文本框" id="btn" /> < ...
- arcgis api 4.x for js 结合 Echarts4 实现散点图效果(附源码下载)
前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 4.x for js:esri 官网 api,里面详细的介绍 arcgis api 4.x 各个类 ...
- 挖掘Dark Sky Maps(热的要死后,疯传的一个气温地图网站)
最近,各种朋友圈,社会媒体,都在疯传一张图,这张图显示的全球的气温图,本没有什么特别的,但是这张图的网站来源所展示的数据与气象局或者各种天气预报的温度值相差倒是不少,引来一片网友的吐槽. 但是,作为专 ...
- Java学习笔记--线程day01
线程的概念:一个线程是进程的顺序执行流: 同类的多个线程共享一块内存空间和一组系统资源,线程本身有一个供程序执行时的堆栈.线程在切换时负荷小,因此,线程也被称为轻负荷进程.一个进程中可以有多个线程. ...
- APP爬虫(1)想学新语言,又没有动力,怎么办?
最近Python和GO语言很火,想学但是只能看得懂21天精通这种级别的教程.公司的项目暂时不会上py或go的技术栈,给的薪资福利待遇还可以,暂时又不想辞职.没有项目实战经验,完全看不懂大神写的干货,怎 ...