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 相关文章推荐
Javascript 日期对象Date扩展方法
May 30 Javascript
jquery 新手学习常见问题解决方法
Apr 18 Javascript
基于jquery实现的移入页面上空文本框时,让它变为焦点,移出清除焦点
Jul 26 Javascript
30个精美的jQuery幻灯片效果插件和教程
Aug 23 Javascript
原生JS可拖动弹窗效果实例代码
Nov 09 Javascript
JS日期格式化之javascript Date format
Oct 01 Javascript
JavaScript给input的value赋值引发的关于基本类型值和引用类型值问题
Dec 07 Javascript
js操作DOM--添加、删除节点的简单实例
Jul 08 Javascript
JavaScript数据结构之双向链表和双向循环链表的实现
Nov 28 Javascript
webpack4的迁移的使用方法
May 25 Javascript
微信小程序 下拉刷新及上拉加载原理解析
Nov 06 Javascript
React冒泡和阻止冒泡的应用详解
Aug 18 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
收集的php编写大型网站问题集
2007/03/06 PHP
Optimizer与Debugger兼容性问题的解决方法
2008/12/01 PHP
PHP使用Session遇到的一个Permission denied Notice解决办法
2014/07/30 PHP
PHP未登录自动跳转到登录页面
2016/12/21 PHP
php中的异常和错误浅析
2017/05/03 PHP
yii2项目实战之restful api授权验证详解
2017/05/20 PHP
php设计模式之装饰模式应用案例详解
2019/06/17 PHP
javascript学习随笔(使用window和frame)的技巧
2007/03/08 Javascript
jQuery 下拉列表 二级联动插件分享
2012/03/29 Javascript
jquery实现带复选框的表格行选中删除时高亮显示
2013/08/01 Javascript
JavaScript获取多个数组的交集简单实例
2013/11/11 Javascript
Egret引擎开发指南之运行项目
2014/09/03 Javascript
jQuery实现带滚动线条导航效果的方法
2015/01/30 Javascript
Jquery树插件zTree用法入门教程
2015/02/17 Javascript
javascript+HTML5的canvas实现七夕情人节3D玫瑰花效果代码
2015/08/04 Javascript
jQuery插件FusionCharts绘制的2D双面积图效果示例【附demo源码】
2017/04/11 jQuery
详解Node.js 中使用 ECDSA 签名遇到的坑
2018/11/26 Javascript
微信小程序template模版的使用方法
2019/04/13 Javascript
Javascript数组方法reduce的妙用之处分享
2019/06/10 Javascript
详解Webpack如何引入CDN链接来优化编译后的体积
2019/06/21 Javascript
400多行Python代码实现了一个FTP服务器
2012/05/10 Python
python3 模拟登录v2ex实例讲解
2017/07/13 Python
详解Python3中ceil()函数用法
2019/02/19 Python
浅谈matplotlib默认字体设置探索
2021/02/03 Python
css3 media 响应式布局的简单实例
2016/08/03 HTML / CSS
S’well Bottle保温杯官网:绝缘不锈钢水瓶
2018/05/09 全球购物
美国值得信赖的婚恋交友网站:eHarmony
2018/10/04 全球购物
招商经理岗位职责
2013/11/16 职场文书
写给妈妈的道歉信
2014/01/11 职场文书
中式餐厅创业计划书范文
2014/01/23 职场文书
对祖国的寄语大全
2014/04/11 职场文书
党员个人整改方案及措施
2014/10/25 职场文书
大学生实习推荐信
2015/03/27 职场文书
2015年学校财务工作总结
2015/05/19 职场文书
基于Apache Hudi在Google云构建数据湖平台的思路详解
2022/04/07 Servers
Python采集壁纸并实现炫轮播
2022/04/30 Python