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 相关文章推荐
jQuery中append、insertBefore、after与insertAfter的简单用法与注意事项
Apr 04 Javascript
jQuery移动和复制dom节点实用DOM操作案例
Dec 17 Javascript
JQuery操作Select的Options的Bug(IE8兼容性视图模式)
Apr 21 Javascript
js中的屏蔽的使用示例
Jul 30 Javascript
微信小程序 开发MAP(地图)实例详解
Jun 27 Javascript
iscroll实现下拉刷新功能
Jul 18 Javascript
基于js 各种排序方法和sort方法的区别(详解)
Jan 03 Javascript
vuex actions传递多参数的处理方法
Sep 18 Javascript
JavaScript常见继承模式实例小结
Jan 11 Javascript
Node.js原生api搭建web服务器的方法步骤
Feb 15 Javascript
vue实现将一个数组内的相同数据进行合并
Nov 07 Javascript
在Uni中使用Vue的EventBus总线机制操作
Jul 31 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判断远程图片是否存在的几种方法
2014/05/04 PHP
Laravel框架表单验证详解
2014/09/04 PHP
10个超级有用值得收藏的PHP代码片段
2015/01/22 PHP
PHP文件与目录操作示例
2016/12/24 PHP
php 中奖概率算法实现代码
2017/01/25 PHP
PHP中PDO事务处理操作示例
2018/05/02 PHP
jQuery对表单元素的取值和赋值操作代码
2011/05/19 Javascript
自动设置iframe大小的jQuery代码
2013/09/11 Javascript
js onload处理html页面加载之后的事件
2013/10/30 Javascript
javascript实现3D切换焦点图
2015/10/16 Javascript
jQuery简单设置文本框回车事件的方法
2016/08/01 Javascript
jQuery绑定事件的四种方式介绍
2016/10/31 Javascript
详解React项目的服务端渲染改造(koa2+webpack3.11)
2018/03/19 Javascript
vue初始化动画加载的实例
2018/09/01 Javascript
服务端预渲染之Nuxt(使用篇)
2019/04/08 Javascript
浅谈layui框架自带分页和表格重载的接口解析问题
2019/09/11 Javascript
gearman的安装启动及python API使用实例
2014/07/08 Python
Python中运行并行任务技巧
2015/02/26 Python
纯python实现机器学习之kNN算法示例
2018/03/01 Python
Python实现替换文件中指定内容的方法
2018/03/19 Python
Python之dict(或对象)与json之间的互相转化实例
2018/06/05 Python
python使用itchat模块给心爱的人每天发天气预报
2019/11/25 Python
CSS3 绘制BMW logo实的现代码
2013/04/25 HTML / CSS
可能这些是你想要的H5软键盘兼容方案(小结)
2019/04/23 HTML / CSS
单位领导证婚词
2014/01/14 职场文书
高一英语教学反思
2014/01/22 职场文书
小学体育教学反思
2014/01/31 职场文书
2014年教研活动总结范文
2014/04/26 职场文书
教师年度考核评语
2014/04/28 职场文书
上诉状格式
2015/05/23 职场文书
公务员廉洁从政心得体会
2016/01/19 职场文书
优秀家长事迹材料(2016推荐版)
2016/02/29 职场文书
golang DNS服务器的简单实现操作
2021/04/30 Golang
pytorch 带batch的tensor类型图像显示操作
2021/05/20 Python
canvas实现贪食蛇的实践
2022/02/15 Javascript
解决Springboot PostMapping无法获取数据的问题
2022/05/06 Java/Android