async-validator：记录其在项目中的使用

最新推荐文章于 2024-07-23 17:28:57 发布

Gabriel_wei

最新推荐文章于 2024-07-23 17:28:57 发布

阅读量591

点赞数

分类专栏：前端学习工具文章标签：插件 async-validator validator

本文链接：https://blog.csdn.net/Gabriel_wei/article/details/97144756

版权

前端同时被 3 个专栏收录

183 篇文章 7 订阅

订阅专栏

学习

61 篇文章 0 订阅

订阅专栏

工具

38 篇文章 0 订阅

订阅专栏

async-validator

github

他人翻译的使用文档

校验规则rules书写方式

直接写规则

rules: {
  name: [
    { required: true, message: '请输入活动名称', trigger: 'blur' },
    { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
  ],
  region: [
    { required: true, message: '请选择活动区域', trigger: 'change' }
  ],
  date1: [
    { type: 'date', required: true, message: '请选择日期', trigger: 'change' }
  ],
  date2: [
    { type: 'date', required: true, message: '请选择时间', trigger: 'change' }
  ],
  type: [
    { type: 'array', required: true, message: '请至少选择一个活动性质', trigger: 'change' }
  ],
  resource: [
    { required: true, message: '请选择活动资源', trigger: 'change' }
  ],
  desc: [
    { required: true, message: '请填写活动形式', trigger: 'blur' }
  ]
}

规则写在函数里

  private rules = {
    pass: [{ validator: this.validatePassword, trigger: 'blur' }]
  };
  private validatePassword = (rule: any, value: string, callback: Function) => {
   if (value.length < 6) {
     callback(new Error('The password can not be less than 6 digits'))
   } else {
     callback()
   }
 };