时间选择器 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 ...
随机推荐
- Python实现各类验证码识别
项目地址: https://github.com/kerlomz/captcha_trainer 编译版下载地址: https://github.com/kerlomz/captcha_trainer ...
- 从零搭建Spring Boot脚手架(5):整合 Mybatis Plus
1. 前言 在上一文中我根据Mybatis中Mapper的生命周期手动实现了一个简单的通用Mapper功能,但是遗憾的是它缺乏实际生产的检验.因此我选择更加成熟的一个Mybatis开发增强包.它就是已 ...
- C#设计模式之12-代理模式
代理模式(Proxy Pattern) 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/411 访问. 代理模式属于结构型 ...
- C#LeetCode刷题之#4-两个排序数组的中位数(Median of Two Sorted Arrays)
问题 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/4005 访问. 给定两个大小为 m 和 n 的有序数组 nums1 ...
- for语句——猜数字
#define _CRT_SECURE_NO_WARNINGS #include<stdio.h> #include<string.h> #include<stdlib. ...
- 火题小战 C. 情侣?给我烧了!
火题小战 C. 情侣?给我烧了! 题目描述 有 \(n\) 对情侣来到电影院观看电影.在电影院,恰好留有 \(n\) 排座位,每排包含 \(2\) 个座位,共 \(2×n\) 个座位. 现在,每个人将 ...
- 自建本地服务器,自建Web服务器——保姆级教程!
搭建本地服务器,Web服务器--保姆级教程! 本文首发于https://blog.chens.life/How-to-build-your-own-server.html. 先上图!大致思路就是如此. ...
- eclipse项目文件夹整理
1.点击倒三角 2.系统默认为Projects,选择第二个working sets 3.点击Configure Working Sets,点new 4.点击后,选中点Add 5.添加一个名字,Fins ...
- java基础-02:编译型和解释型
Java程序运行机制: Java语言的编译-->解释-->运行过程 1.编译型语言:程序在执行之前需要一个专门的编译过程,把程序编译成为机器语言的文件,运行时不需要重新翻译,直接使用编译的 ...
- Jmeter 常用函数(6)- 详解 __P
如果你想查看更多 Jmeter 常用函数可以在这篇文章找找哦 https://www.cnblogs.com/poloyy/p/13291704.html 作用 和 __property 作用一样,不 ...