vue element ui validate 主动触发错误提示操作


Posted in Javascript onSeptember 21, 2020

elementUI使用了async-validator进行表单验证,但是当我使用下拉树(el-cascader)时,发现其不主动触发,于是我只能主动去触发,方法如下:

this.$refs['form'].fields[0].validateMessage = 'error message'

this.$refs['form'].fields[0].validateState = 'error'

补充知识:element-ui 打开页面触发校验问题

如果你设置了关闭弹出页就resetFields(),此时打开页面仍然触发校验效果,一般是下拉框和时间选择导致的,解决办法就是更改校验规则rules,

endTime: [{ type: 'string', required: true, message: '请选择', trigger: 'blur' }],

type: [{ type: 'number', required: true, message: '请选择', trigger: 'blur' }],

此时,你的下拉选择类型要正确,就像我,此时下拉框的value是number,那么这里就是number,假如你的下拉框对应的value是string,类型相应改变。

与此同时,element-ui有个坑,时区问题,导致传向后台的时间和选择的时间相差八个小时,此时你需要设置

value-format="yyyy-MM-dd HH:mm:ss"

这样,传向后台是一个字符串,校验时,就需要按照endTime的规则了

以上这篇vue element ui validate 主动触发错误提示操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
利用js获取服务器时间的两个简单方法
Jan 08 Javascript
jQuery弹出(alert)select选择的值
Apr 21 Javascript
可自己添加html的伪弹出框实现代码
Sep 08 Javascript
JS正则表达式获取分组内容的方法详解
Nov 15 Javascript
利用jquery.qrcode在页面上生成二维码且支持中文
Feb 12 Javascript
JS实现无缝循环marquee滚动效果
May 22 Javascript
Vue的Class与Style绑定的方法
Sep 01 Javascript
微信小程序实现图片滚动效果示例
Dec 05 Javascript
使用vue-router切换页面时,获取上一页url以及当前页面url的方法
May 06 Javascript
使用Vue-scroller页面input框不能触发滑动的问题及解决方法
Aug 08 Javascript
JS实现拖动模糊框特效
Aug 25 Javascript
javascript自定义加载loading效果
Sep 15 Javascript
Vue Element校验validate的实例
Sep 21 #Javascript
在vue中实现某一些路由页面隐藏导航栏的功能操作
Sep 21 #Javascript
vue3.0 上手体验
Sep 21 #Javascript
微信小程序实现点击页面出现文字
Sep 21 #Javascript
vue pages 多入口项目 + chainWebpack 全局引用缩写说明
Sep 21 #Javascript
理解JavaScript中的Proxy 与 Reflection API
Sep 21 #Javascript
vue实践---根据不同环境,自动转换请求的url地址操作
Sep 21 #Javascript
You might like
造势之举?韩国总统候选人发布《星际争霸》地图
2017/04/22 星际争霸
php仿discuz分页效果代码
2008/10/02 PHP
深入php define()函数以及defined()函数的用法详解
2013/06/05 PHP
php function用法如何递归及return和echo区别
2014/03/07 PHP
PHP超全局数组(Superglobals)介绍
2015/07/01 PHP
PHP中使用jQuery+Ajax实现分页查询多功能操作(示例讲解)
2017/09/17 PHP
PHP 计算两个时间段之间交集的天数示例
2019/10/24 PHP
laravel框架中表单请求类型和CSRF防护实例分析
2019/11/23 PHP
javascript 获取select下拉列表值的代码
2009/09/07 Javascript
Javascript面象对象成员、共享成员变量实验
2010/11/19 Javascript
去掉gridPanel表头全选框的小例子
2013/07/18 Javascript
js获取视频时长代码
2014/04/10 Javascript
不使用ajax实现无刷新提交表单
2014/12/21 Javascript
JS+CSS实现仿雅虎另类滑动门切换效果
2015/10/13 Javascript
基于AngularJS实现页面滚动到底自动加载数据的功能
2015/10/16 Javascript
详解JavaScript基于面向对象之继承实例
2015/12/16 Javascript
Bootstrap3制作自己的导航栏
2016/05/12 Javascript
Javascript之Number对象介绍
2016/06/07 Javascript
jQuery实现左侧导航模块的显示与隐藏效果
2016/07/04 Javascript
详解利用 Express 托管静态文件的方法
2017/09/18 Javascript
JS实现的简单表单验证功能完整实例
2017/10/14 Javascript
浅谈React高阶组件
2018/03/28 Javascript
对vue v-if v-else-if v-else 的简单使用详解
2018/09/29 Javascript
原生小程序封装跑马灯效果
2020/10/21 Javascript
python翻译软件实现代码(使用google api完成)
2013/11/26 Python
scrapy数据存储在mysql数据库的两种方式(同步和异步)
2020/02/18 Python
Python操作MongoDb数据库流程详解
2020/03/05 Python
Jar包的作用是什么
2014/03/30 面试题
生产部厂长职位说明书
2014/03/03 职场文书
元旦联欢会感言
2014/03/04 职场文书
取保候审保证书
2014/04/30 职场文书
安全保证书
2015/01/16 职场文书
2015年敬老月活动总结
2015/03/27 职场文书
正规欠条模板
2015/07/03 职场文书
公安纪律作风整顿心得体会
2016/01/23 职场文书
Python insert() / append() 用法 Leetcode实战演示
2021/03/31 Python