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实现HTML5 Canvas六种特效滤镜示例
Jun 28 Javascript
使用focus方法让光标默认停留在INPUT框
Jul 29 Javascript
jQuery函数map()和each()介绍及异同点分析
Nov 08 Javascript
Bootstrap每天必学之标签与徽章
Nov 27 Javascript
老生常谈js动态添加事件--- 事件委托
Jul 19 Javascript
JavaScript DOM节点操作实例小结(新建,删除HTML元素)
Jan 19 Javascript
VUE实现日历组件功能
Mar 13 Javascript
从零开始学习Node.js系列教程四:多页面实现的数学运算示例
Apr 13 Javascript
JS实现的tab页切换效果完整示例
Dec 18 Javascript
浅谈KOA2 Restful方式路由初探
Mar 14 Javascript
详解javascript对数组和json数组的操作
Apr 15 Javascript
node命令行工具之实现项目工程自动初始化的标准流程
Aug 12 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
全国FM电台频率大全 - 6 辽宁省
2020/03/11 无线电
php下尝试使用GraphicsMagick的缩略图功能
2011/01/01 PHP
php学习之流程控制实现代码
2011/06/09 PHP
php中判断字符串是否全是中文或含有中文的实现代码
2011/09/16 PHP
PHP使用GETDATE获取当前日期时间作为一个关联数组的方法
2015/03/19 PHP
php同时使用session和cookie来保存用户登录信息的实现代码
2016/05/13 PHP
phpStudy中升级MySQL版本到5.7.17的方法步骤
2017/08/03 PHP
php使用array_chunk函数将一个数组分割成多个数组
2018/12/05 PHP
event对象获取方法总结在google浏览器下测试
2013/11/03 Javascript
JS实现字体选色板实例代码
2013/11/20 Javascript
使用原生js实现页面蒙灰(mask)效果示例代码
2014/06/20 Javascript
jQuery实现统计输入文字个数的方法
2015/03/11 Javascript
每天一篇javascript学习小结(Array数组)
2015/11/11 Javascript
Bootstrap打造一个左侧折叠菜单的系统模板(一)
2016/05/17 Javascript
在线引用最新jquery文件的实现方法
2016/08/26 Javascript
JS简单实现浮动窗口效果示例
2016/09/07 Javascript
Node.js+ES6+dropload.js实现移动端下拉加载实例
2017/06/01 Javascript
React Native 搭建开发环境的方法步骤
2017/10/30 Javascript
ExtJs整合Echarts的示例代码
2018/02/27 Javascript
vue使用监听实现全选反选功能
2018/07/06 Javascript
浅析vue-router实现原理及两种模式
2020/02/11 Javascript
[03:44]2014DOTA2国际邀请赛 71专访:DK战队赛前讨论视频遭泄露
2014/07/13 DOTA
在Windows8上的搭建Python和Django环境
2014/07/03 Python
python之Character string(实例讲解)
2017/09/25 Python
python根据unicode判断语言类型实例代码
2018/01/17 Python
解决pandas无法在pycharm中使用plot()方法显示图像的问题
2018/05/24 Python
详解python使用pip安装第三方库(工具包)速度慢、超时、失败的解决方案
2018/12/02 Python
python实现人机五子棋
2020/03/25 Python
python实现图片素描效果
2020/09/26 Python
Html5饼图绘制实现统计图的方法
2020/08/05 HTML / CSS
美国领先的礼品卡网站:GiftCards.com
2016/11/02 全球购物
2015年护士节活动总结
2015/02/10 职场文书
民政局2016年“六一”儿童节慰问活动总结
2016/04/06 职场文书
Python3中PyQt5简单实现文件打开及保存
2021/06/10 Python
Python实现查询剪贴板自动匹配信息的思路详解
2021/07/09 Python
win10系统计算机图标怎么调出来?win10调出计算机图标的方法
2022/08/14 数码科技