时间选择器 element
<el-date-picker
type="datetime"
placeholder="选择上线日期"
:picker-options="startDatePicker"
v-model="addStartPageForm.onlineTime"
value-format="yyyy-MM-dd HH:mm:ss"
style="width: 100%;"
></el-date-picker> <el-date-picker
type="datetime"
placeholder="选择下线日期"
v-model="addStartPageForm.downlineTime"
:picker-options="endDatePicker"
value-format="yyyy-MM-dd HH:mm:ss"
@change="checkDateTime"
style="width: 100%;"
></el-date-picker>
data
startDatePicker: {},
endDatePicker: {},
method //设置开始时间 禁用昨天和以前时间
beginDate() {
return {
disabledDate(time) {
return new Date().getTime() - 60 * 60 * 24 * 1000 >= time.getTime();
},
};
},
//设置结束时间 禁用昨天和以前时间
processDate() {
const _this = this;
return {
disabledDate(time) {
if (_this.addStartPageForm.onlineTime) {
return (
new Date(_this.addStartPageForm.onlineTime).getTime() -
60 * 60 * 24 * 1000 >=
time.getTime()
);
}
},
};
},
//结束时间必须大于开始时间
checkDateTime(val) {
if (
this.addStartPageForm.onlineTime &&
this.addStartPageForm.downlineTime
) {
if (new Date(this.addStartPageForm.onlineTime) > new Date(val)) {
this.$message.error("结束时间必须大于开始时间");
this.addStartPageForm.downlineTime = "";
}
}
},
created() {
this.startDatePicker = this.beginDate(); //设置开始时间
this.endDatePicker = this.processDate(); //设置结束时间
},
时间选择器 element的更多相关文章
- JavaScript 数字转汉字+element时间选择器快速选择
window.CN = { : '一', : '二', : '三', : '四', : '五', : '六', : '七', : '八', : '九', : '零' } window.LEVEL = ...
- 微信小程序中利用时间选择器和js无计算实现定时器(将字符串或秒数转换成倒计时)
转载注明出处 改成了一个单独的js文件,并修改代码增加了通用性,点击这里查看 今天写小程序,有一个需求就是用户选择时间,然后我这边就要开始倒计时. 因为小程序的限制,所以直接选用时间选择器作为选择定时 ...
- 移动端lCalendar纯原生js日期时间选择器
网上找过很多的移动端基于zepto或jquery的日期选择器,在实际产品中也用过一两种,觉得都不太尽如人意,后来果断选择了H5自己的日期input表单,觉得还可以,至少不用引用第三方插件了,性能也不错 ...
- ClockPicker – 时钟风格 Bootstrap 时间选择器
ClockPicker 是国内前端开发者发布的一个时钟样式 Timepicker,可以用于 Bootstrap 和 jQuery.所有主流浏览器都支持,包括 IE9+,支持移动设备,能够在触摸屏设备很 ...
- Android课程---日历选择器和时间选择器
package com.hanqi.test5; import android.os.Bundle; import android.support.annotation.IdRes; import a ...
- 分享一下我封装iOS自定义控件的体会,附上三个好用的控件Demo <时间选择器&多行输入框&日期选择器>
前段时间有小伙伴问到我:"这样的控件该怎么做呢?",我感觉是个比较简单的控件,可能对于入行不久的同志思路没有很清晰吧.趁着最近工作不忙,就来这里分享一下我封装自定义控件的几点体会吧 ...
- bootstrap 时间选择器 datetime
$("'#datetimepicker").datetimepicker({ format: "yyyy-mm-dd hh:ii:ss",//设置时间格式,默认 ...
- 移动端material风格日期时间选择器
原文 好多时候在移动端需要一个的日期选择器,由于在应用上有可能应用各种框架库(Vue.js, React.js, zepto.js等):所以说一个无依赖的,这样易于上层进行封装.直接开门见山,先来张动 ...
- Android日期时间选择器实现以及自定义大小
本文主要讲两个内容:1.如何将DatePicker和TimePicker放在一个dialog里面:2.改变他们的宽度: 问题1:其实现思路就是自定义一个Dialog,然后往里面同时放入DatePick ...
随机推荐
- 会话机制,Cookie和Session详解
转载自:https://www.cnblogs.com/whgk/p/6422391.html 很大一部分应该知道什么是会话机制,也能说的出几句,我也大概了解一点,但是学了之后几天不用,立马忘的一干二 ...
- Javascript注意点
Javascript注意点 在img标签中的src如果为相对路径, 但是在js获取的时候会转为全路径 候选框中, 在执行onclick之前, 会由于html的特征先设置checked属性 为a标签添加 ...
- idea括号选中时出现一条下滑线(突出显示)打开或关闭方法
打开设置 Editor->code Editing->Matched brace取消这个对勾
- 【计算机算法设计与分析】——NP
时间复杂度 时间复杂度并不是表示一个程序解决问题需要花多少时间,而是当问题规模扩大后,程序需要的时间长度增长得有多快.也就是说,对于高速处理数据的计算机来说,处理某一个特定数据的效率不能衡量一个程序的 ...
- java web 下载文件 response.setHeader()的用法 (转载)
response.setHeader()的用法 response.setHeader()下载中文文件名乱码问题 收藏 1. HTTP消息头 (1)通用信息头 即能用于请求消息中,也能用于响应信息中,但 ...
- HBA卡常用命令
HBA卡信息查看 查看对应的PCI设备lspci | grep LSI 如下:对应的HBA卡命令为sas3ircu 如下:对应的HBA卡使用sas2ircu 查看LSI控制器类型和型号 sas2irc ...
- unity探索者之复制内容到剪贴板
版权声明:本文为原创文章,转载请声明http://www.cnblogs.com/unityExplorer/p/8417014.html unity中提供的TextEditor类,只能在window ...
- java中extends与implements的区别
学了java很久了,久不用之后给同学解决一个java问题的时候,就卡在这个标题上了. 下面是java中extends与implements的区别: 1. 在类的声明中,通过关键字extends来创建一 ...
- 源码解析JDK1.8-HashMap链表成环的问题解决方案
前言 上篇文章详解介绍了HashMap在JDK1.7版本中链表成环的原因,今天介绍下JDK1.8针对HashMap线程安全问题的解决方案. jdk1.8 扩容源码解析 public class Has ...
- .NET Core + K8S + Apollo 玩转配置中心
1.引言 Apollo(阿波罗)是携程框架部门研发的分布式配置中心,能够集中化管理应用不同环境.不同集群的配置,配置修改后能够实时推送到应用端,并且具备规范的权限.流程治理等特性,适用于微服务配置管理 ...