时间:2021-05-26
前言
有ABCD四个表单,提交的时候同时校验(是的,后台管理系统的需求就是这样),巧用new promise。
实现的方法有很多种,我讲下自己觉得比较优雅的方式,欢迎各位大大的指正哈。
代码
let formArr=['formA','formB','formC','formD']//假设这是四个form表单的refvar resultArr=[]//用来接受返回结果的数组var _self=this function checkForm(formName) { //封装验证表单的函数 var result = new Promise(function(resolve, reject) { _self.$refs[formName].validate((valid) => { if (valid) { resolve(); } else { reject() } }) }) resultArr.push(result) //push 得到promise的结果}formArr.forEach(item => { //根据表单的ref校验 checkForm(item) })Promise.all(resultArr).then(function() { //都通过了 alert('恭喜你,表单全部验证通过啦')}).catch(function() { console.log("err");});总结
以上所述是小编给大家介绍的Vue ElementUi同时校验多个表单(巧用new promise),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
嵌套对象的校验项目中使用的vue+elementUI进行开发,已经用了有一段时间了,感觉表单校验是每一个前端开发人员都避免不了的需求。在一些前端可以自行校验的情
vee-validate是为Vue.js量身打造的表单校验框架,允许您校验输入的内容并显示对应的错误提示信息。它内置了很多常见的校验规则,可以组合使用多种校验规
vee-validate是为Vue.js量身打造的表单校验框架,允许您校验输入的内容并显示对应的错误提示信息。它内置了很多常见的校验规则,可以组合使用多种校验规
导读:在表单页中有如下代码jqueryvalidate在对多个相同name校验时,只校验第一个input框。解决方案一:在表单页对应的js中加入如下代码只有当前
应用场景:在实际使用中经常会遇到需要在Form表单中使用table表格进行表单提交,同时又需要对table的字段进行校验,效果如图所示:这个校验中,最关键的问题