【分享】宜搭js代码验证组件校验结果(触发组件校验)

简介: 有时候需要手动触发校验,特别是自定义页面,校验通过才进行下一步 by 页一

校验通过后函数返回true,否则返回false

fieldList可以是任何宜搭输入组件,也支持子表单

  • 校验代码如下
//true 所有校验通过  false校验不通过exportasyncfunctionfieldsValidate(fieldList= []) {
letresult=true;
awaitPromise.all(fieldList.map(item=>newPromise(resolve=> {
this.$(item).validate(errors=> {
if (errors!==null&&errors.errors!==null)
result=false;
resolve();
      });
    }))
  ).catch(err=>this.utils.toast(err.message));
returnresult;
}


调用方法选一个就行了,一:回调写法,二:异步写法

  • 调用方法1
exportfunctiononClick() {
this.fieldsValidate([
'tableField_lf9eo273', 'textField_lfagaqzb', 'radioField_lfagaqzd', 'cascadeDateField_lfagaqze'  ]).then(res=> {
if (res) {
//校验通过...console.log('校验通过');
    }
  })
}
  • 调用方法2
//注意函数名前 加asyncexportasyncfunctiononClick() {
letres=awaitthis.fieldsValidate([
'tableField_lf9eo273', 'textField_lfagaqzb', 'radioField_lfagaqzd','cascadeDateField_lfagaqze'    ]);
if (res) {
//校验通过...console.log('校验通过');
  }
}

钉钉.png+

目录
相关文章
|
移动开发 JavaScript 前端开发
JavaScript:验证输入
【9月更文挑战第02天】
551 6
|
JavaScript 前端开发 开发者
哇塞!Vue.js 与 Web Components 携手,掀起前端组件复用风暴,震撼你的开发世界!
【8月更文挑战第30天】这段内容介绍了Vue.js和Web Components在前端开发中的优势及二者结合的可能性。Vue.js提供高效简洁的组件化开发,单个组件包含模板、脚本和样式,方便构建复杂用户界面。Web Components作为新兴技术标准,利用自定义元素、Shadow DOM等技术创建封装性强的自定义HTML元素,实现跨框架复用。结合二者,不仅增强了Web Components的逻辑和交互功能,还实现了Vue.js组件在不同框架中的复用,提高了开发效率和可维护性。未来前端开发中,这种结合将大有可为。
646 0
|
存储 JavaScript
|
JavaScript 前端开发 API
探索Vue.js 3的组合式API:一种更灵活的组件状态管理方式
【10月更文挑战第5天】探索Vue.js 3的组合式API:一种更灵活的组件状态管理方式
|
JavaScript 前端开发 API
JavaScript 验证 API
JavaScript 验证 API
190 2
|
前端开发 微服务 API
微服务浪潮下的JSF革新:如何在分散式架构中构建统一而强大的Web界面
【8月更文挑战第31天】随着微服务架构的兴起,企业将应用拆分成小型、独立的服务以提高系统可维护性和可扩展性。本文探讨如何在微服务架构下构建和部署JavaServer Faces (JSF) 应用,通过RESTful服务实现前后端分离,提升灵活性和适应性。
300 1
|
JavaScript 前端开发
揭秘Vue.js组件魔法:如何轻松驾驭前端代码,让维护变得轻而易举?
【8月更文挑战第30天】本文探讨了如何利用Vue.js的组件化开发提升前端代码的可维护性。组件化开发将复杂页面拆分为独立、可复用的组件,提高开发效率和代码可维护性。Vue.js支持全局及局部组件注册,并提供了多种组件间通信方式如props、事件等。通过示例展示了组件定义、数据传递及复用组合的方法,强调了组件化开发在实际项目中的重要性。
187 1
|
JavaScript 前端开发 测试技术
[译]: Vue.js 函数式组件:what, why & when?
[译]: Vue.js 函数式组件:what, why & when?
[译]: Vue.js 函数式组件:what, why & when?
|
编解码 JavaScript 前端开发
JS逆向浏览器脱环境专题:事件学习和编写、DOM和BOM结构、指纹验证排查、代理自吐环境通杀环境检测、脱环境框架、脱环境插件解决
JS逆向浏览器脱环境专题:事件学习和编写、DOM和BOM结构、指纹验证排查、代理自吐环境通杀环境检测、脱环境框架、脱环境插件解决
1129 1
|
JavaScript 数据安全/隐私保护
如何在Vue组件中调用封装好的外部js文件方法
这篇文章介绍了如何在Vue组件中调用封装好的外部js文件方法,包括在Vue项目中全局引入外部js文件,并在组件中通过this.$myMethod()的方式调用外部js文件中定义的方法。
如何在Vue组件中调用封装好的外部js文件方法

相关产品