element-ui 表单自定义日期输入校验
validateDate(rule, value, callback){
if (value) {
let timestamp = new Date(value).getTime()
let start = new Date(this.shiftStartTime).getTime()
let end = new Date(this.shiftEndTime).getTime()
if (end < timestamp || timestamp < start) {
callback(new Error(`请在值班时间内选择 ${this.shiftStartTime} 至 ${this.shiftEndTime}`))
} else {
callback()
}
} else {
callback()
}
}
}
<el-form-item
label="记录时间"
prop="recordDateTime"
:rules="[
{ required: true, message: '记录时间不能为空', trigger: 'blur'},
{ validator: validateDate, trigger: ['blur', 'change'] }
]"
>
<el-date-picker
v-model="summaryForm.recordDateTime"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="选择日期"
></el-date-picker>
</el-form-item>
element-ui 表单自定义日期输入校验的更多相关文章
- 关于vue.js element ui 表单验证 this.$refs[formName].validate()的问题
方法使用前需了解: 来自”和“小编的小提示: 首先打印一下this.$refs[formName],检查是否拿到了正确的需要验证的form. 其次在拿到了正确的form后,检查该form上添加 ...
- vue开源Element UI表单设计及代码生成器
在日常的开发工作中,表单开发是较为繁琐且重复的.本文介绍一个我自己写的,提高开发效率的小工具. 1 可视化设计器 设计器基于Element UI ,可通过点击或拖拽的方式设计基本表单, 设计器生成的代 ...
- (vue.js)element ui 表单重置
el-form需要接收一个model,并且需要配合el-form-item一起使用,并且在el-form-item上绑定prop属性,resetField方法才能好使. <el-form :mo ...
- vue踩坑:vue+ element ui 表单验证有值但验证失败。
一.如图:有值但是验证失败 二. <el-form :model="form" :rules="rules"> <el-form-item l ...
- Rails-Treasure chest1 (自定义Model网址;多语言包; 时区设置, TimeZone类; 格式日期时间; 表单单选UI; 表单多选UI;Select2 Plugin)
自定义Model网址: 随机值网址SecureRandom.base58 多语言包, 包括默认语言设置和user自设置. 时区设置, TimeZone类 ,增加user自选时区功能 格式日期时间: x ...
- Element Form表单实践(上)
作者:小土豆biubiubiu 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.im/user/58c61b4361ff4b005d9e8 ...
- Vue Element Form表单时间验证控件使用
如果直接使用Element做时间选择器,其规则(rules)不添加type:'date',会提示类型错误,处理这个需要规范值的类型为date. 时间格式化过滤器 import Vue from 'vu ...
- UI表单
Monk.UI表单美化插件诞生记! 阅读目录 背景 预览效果 表单组件 普通文本框 多行文本框 复选框 切换滑块 单选框 下拉选择框 数字输入框 时间选择 文件选择 显示文本 按钮 开源地址 背景 ...
- HTML 表单元素、 输入类型、Input 属性
<input> 元素 最重要的表单元素是 <input> 元素. <input> 元素根据不同的 type 属性,可以变化为多种形态. 注释:下一章讲解所有 HTM ...
随机推荐
- LC 957. Prison Cells After N Days
There are 8 prison cells in a row, and each cell is either occupied or vacant. Each day, whether the ...
- bind绑定服务的生命周期
bindService(service, conn, flags); * service :意图 * conn :activity和服务的连接通道 * flags : BIND_AUTO_CREATE ...
- 定位上下文(补充css的position属性)
]把元素的position属性设定为relative.absolute或fixed后,继而可以使用TRBL属性,相对于另一个元素移动该元素的位置.这里的“另一个元素”,就是该元素的定位上下文. 绝对定 ...
- kafka整合springboot
1.pom.xml添加依赖 <dependency> <groupId>org.springframework.kafka</groupId> <artifa ...
- java+ueditor word粘贴上传
最近公司做项目需要实现一个功能,在网页富文本编辑器中实现粘贴Word图文的功能. 我们在网站中使用的Web编辑器比较多,都是根据用户需求来选择的.目前还没有固定哪一个编辑器 有时候用的是UEditor ...
- centos6.8(虚拟机VNC)输入正确用户名和密码仍跳回登录界面
1)CentOS自动更新到6.8后root无法登陆问题解决 虚拟机CentOS服务器不知道被谁更新系统到6.8后,发现在本机上即使输入正确的密码也无法登陆,发现有一些人也碰见过同样的问题,但是他们是因 ...
- web系统认证与鉴权中的一些问题
认证鉴权系统的初心: 空间管理: 1.他是谁? 他登陆了没有? 2.他要做什么? 2.1 他要使用什么功能? 他是否有这个功能的权限. 2.2 他要使用这个功能做什么操作? 他是否有这个功能的这个操作 ...
- iOS UITextField限制输入字数
关于iOS的文本框有时需要限制字数,如手机号,在UITextField的代理单纯写一个判断,在字数超过限制时,这时再想删除就删除不掉,可以在代理这样写,就解决 - (BOOL)textField:(U ...
- pandas - parse-date
1.pd.read_csv()函数中parse_dates()参数 boolean. True -> 解析索引 boolean. If True -> try parsing the in ...
- Spring自定义参数解析器
结合redis编写User自定义参数解析器UserArgumentResolver import javax.servlet.http.Cookie; import javax.servlet.htt ...