当前位置: 首页 > article >正文

微信小程序 表单验证(async-validator)

一. 安装

npm i async-validator

二. 代码

import Schema from 'async-validator';   // 引用
Page({
    data: {
        name: '',    // 要验证的数据
    },


    // 对数据进行验证
    onValidator() {
        // 定义规则
        const rules = {
            // key 验证规则的名称 名字需要和验证的数据保持一致
            name: [
                // required: 必填
                // message 验证失败 提示的错误信息
                {required: true, message: '名字不能为空!'},

                // type 验证的数据类型
                {type: "string", message: ' name不是字符串!'},

                // min最小位数 max最大位数
                {min: 2, max: 3, message: ' name不是字符串!'},

                // pattern 验证正则
                // {pattern: '', message: ' name不是字符串!'},

                // validator 自定义验证规则
                // {validator: () => {}},
            ]
        };

        // 需要对构造函数进行实例化,同时传入验证规则
        const validator = new Schema(rules);

        // 需要调用validate实例方法 对数据进行验证
        // 第一个参数:需要验证的数据 要求数据是一个对象
        // validate 方法只会验证和验证规则同名的字段
        // 第二个参数:是一个回调函数

        validator.validate(this.data, (errors, fields) => {
            // 如果验证成功, errors是一个null
            // 如果验证失败, errors是一个数组 数组每一项是错误信息

            // fields 是需要验证的属性 属性值是一个数组 数组中也包含错误信息
            if(errors) {
                console.log('验证失败')
                console.log(errors);
                console.log(fields);
            }else {
                console.log('验证成功')
            }
        })
    }

})


http://www.kler.cn/a/408652.html

相关文章:

  • PML和金属边界区别
  • 基于STM32的火灾报警装置的Proteus仿真
  • 《C++智能合约与区块链底层交互全解析:构建坚实的去中心化应用桥梁》
  • ctfshow-Misc入门(1-16)
  • 09 —— Webpack搭建开发环境
  • MySQL系列之身份鉴别(安全)
  • 基于Gradle搭建Spring6.2.x版本源码阅读环境
  • Alluxio在小红书的实践:加速云端机器学习
  • HarmonyOS Next 浅谈 发布-订阅模式
  • 【热门主题】000062 云原生后端:开启高效开发新时代
  • IDEA运行程序》java: 程序包XX不存在
  • shell编程之awk
  • MySQL:IF()函数根据指定条件返回不同的值
  • 【ubuntu+win】Win10+Ubuntu22.04双系统给ubuntu系统中的某个分区进行扩容(从400G->800G)数据无损坏
  • Vue实训---4-使用Pinia实现menu菜单展示/隐藏
  • AWS EventBridge 和 Lambda 监控 ECS 事件并发送钉钉通知
  • Unity图形学之着色器之间传递参数
  • 《AI大模型开发笔记》——LangChain快速入门
  • 数据结构 【带环链表2】
  • spf算法、三类LSA、区间防环路机制/规则、虚连接
  • 实时数据研发|Flink关键概念,什么是无界、有界数据集,流、批?
  • 设计模式之 解释器模式
  • 什么是ROS参数服务器
  • 用Python“拍立淘”:在1688的海洋里寻找宝藏
  • 第 31 章 - Go语言安全性实践
  • 河道水位流量一体化自动监测系统:航运安全的护航使者