Async Validator 异步验证使用说明


Posted in Javascript onJuly 03, 2017

async-validator 是一个异步验证的库,需要传入要验证的数据和验证规则

官方链接 https://github.com/yiminghe/async-validator

要检验的数据,格式要求如下:

{
 a:xxx,
 b:xxx
}

检验规则定义格式如下:

{
 a:[
  {验证规则, message: 'xxx'},
  {验证规则, message: 'xxx'}
 ],
 b:[
  {验证规则, message: 'xxx'}
 ]
}

message是规则没通过时返回的错误消息

举个例子, 因为是异步验证,所以我们用ES6 的 Promise去调用它,方便使用

var inputData = {'item':'12345'}
var rules = [
 {required: true, message: '年龄不能为空'},
 {type: 'number', message: '年龄必须为数字值'}
]
function validateData() {
 var validateRuler = new Promise(function (resolve, reject) {
 var validator = new AsyncValidator(rules)
 validator.validate(inputData, { firstFields: true }, (errors, fields) => {
  resolve(errors)
 })
 return validateRuler
}
function validate() {
 validateData().then(function (errors) {
  console.log(errors)
  if (errors === null) {
    // 通过验证,该干嘛干嘛
  } else {
    // 把验证结果展示在页面上
  }
 })
}
validate()

如果验证没通过是这样

通过了则返回 null

需要注意的是,如果传入的规则是空数组

上面的resolve(errors)是完全不会执行的

以上所述是小编给大家介绍的Async Validator 异步验证使用说明,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
Javascript中自动切换焦点实现代码
Dec 15 Javascript
JS中引用百度地图并将百度地图的logo和信息去掉
Sep 29 Javascript
Bootstrap轮播加上css3动画,炫酷到底!
Dec 22 Javascript
使用vue编写一个点击数字计时小游戏
Aug 31 Javascript
详解微信小程序开发—你期待的分享功能来了,微信小程序序新增5大功能
Dec 23 Javascript
兼容浏览器的js事件绑定函数(详解)
May 09 Javascript
JS二分查找算法详解
Nov 01 Javascript
Angular4 ElementRef的应用
Feb 26 Javascript
Node.js折腾记一:读指定文件夹,输出该文件夹的文件树详解
Apr 20 Javascript
浅谈Vue组件单元测试究竟测试什么
Feb 05 Javascript
Vue 中如何将函数作为 props 传递给组件的实现代码
May 12 Javascript
JavaScript字符和ASCII实现互相转换
Jun 03 Javascript
在vue-cli脚手架中配置一个vue-router前端路由
Jul 03 #Javascript
Require.js的基本用法详解
Jul 03 #Javascript
React利用插件和不用插件实现双向绑定的方法详解
Jul 03 #Javascript
解决webpack -p压缩打包react报语法错误的方法
Jul 03 #Javascript
JS 学习总结之正则表达式的懒惰性和贪婪性
Jul 03 #Javascript
JavaScript之DOM插入更新删除_动力节点Java学院整理
Jul 03 #Javascript
微信小程序开发中的疑问解答汇总
Jul 03 #Javascript
You might like
我的论坛源代码(七)
2006/10/09 PHP
php环境配置 php5 MySQL5 apache2 phpmyadmin安装与配置图文教程
2007/03/16 PHP
PHP中余数、取余的妙用
2015/06/29 PHP
基于PHP实现假装商品限时抢购繁忙的效果
2015/10/16 PHP
Yii2如何批量添加数据
2016/05/17 PHP
完美解决php 导出excle的.csv格式的数据时乱码问题
2017/02/18 PHP
PHP关键特性之命名空间实例详解
2017/05/06 PHP
Laravel 框架路由原理与路由访问实例分析
2020/04/14 PHP
你可能不再需要JQUERY
2021/03/09 Javascript
JavaScript的document对象和window对象详解
2010/12/30 Javascript
javascript中简单的进制转换代码实例
2013/10/26 Javascript
Javscript删除数组中指定元素并返回新数组
2014/03/06 Javascript
jquery实现先淡出再折叠收起的动画效果
2015/08/07 Javascript
jQuery支持添加事件的日历特效代码分享(3种样式)
2015/08/24 Javascript
JavaScript函数的一些注意要点小结及js匿名函数
2015/11/10 Javascript
jQuery图片旋转插件jQueryRotate.js用法实例(附demo下载)
2016/01/21 Javascript
浅谈Sublime Text 3运行JavaScript控制台
2016/06/06 Javascript
JS高级运动实例分析
2016/12/20 Javascript
nodejs处理图片的中间件node-images详解
2017/05/08 NodeJs
node.js将MongoDB数据同步到MySQL的步骤
2017/12/10 Javascript
Vue 实现前端权限控制的示例代码
2019/07/09 Javascript
JS实现京东商品分类侧边栏
2020/12/11 Javascript
[39:02]DOTA2亚洲邀请赛 3.31 小组赛 B组 Mineski vs VGJ.T
2018/04/01 DOTA
跟老齐学Python之??碌某?? target=
2014/09/12 Python
Django实现自定义404,500页面教程
2017/03/26 Python
如何利用python制作时间戳转换工具详解
2018/09/12 Python
编写多线程Python服务器 最适合基础
2018/09/14 Python
flask框架json数据的拿取和返回操作示例
2019/11/28 Python
Python基于内置库pytesseract实现图片验证码识别功能
2020/02/24 Python
Python urllib库如何添加headers过程解析
2020/10/05 Python
英国奢侈品网站:MatchesFashion
2016/12/16 全球购物
巴西箱包、背包、钱包和旅行配件购物网站:Inovathi
2019/12/14 全球购物
linux面试题参考答案(6)
2016/06/23 面试题
营销专业应届生求职信
2013/11/26 职场文书
2014年外联部工作总结
2014/11/17 职场文书
JS实现刷新网页后之前浏览位置保持不变示例详解
2022/08/14 Javascript