小程序 表单验证
使用 WxValidate.js 插件来校验表单数据
常用实例方法
| 名称 | 返回类型 | 描述 |
|---|---|---|
| checkForm(e) | boolean | 验证所有字段的规则,返回验证是否通过。 |
| valid() | boolean | 返回验证是否通过。 |
| size() | number | 返回错误信息的个数。 |
| validationErrors() | array | 返回所有错误信息。 |
| addMethod(name, method, message) | boolean | 添加自定义验证方法。 |
内置校验规则
| 序号 | 规则 | 描述 |
|---|---|---|
| 1 | required: true | 这是必填字段。 |
| 2 | email: true | 请输入有效的电子邮件地址。 |
| 3 | tel: true | 请输入11位的手机号码。 |
| 4 | url: true | 请输入有效的网址。 |
| 5 | date: true | 请输入有效的日期。 |
| 6 | dateISO: true | 请输入有效的日期(ISO),例如:2009-06-23,1998/01/22。 |
| 7 | number: true | 请输入有效的数字。 |
| 8 | digits: true | 只能输入数字。 |
| 9 | idcard: true | 请输入18位的有效身份证。 |
| 10 | equalTo: 'field' | 输入值必须和 field 相同。 |
| 11 | contains: 'ABC' | 输入值必须包含 ABC。 |
| 12 | minlength: 5 | 最少要输入 5 个字符。 |
| 13 | maxlength: 10 | 最多可以输入 10 个字符。 |
| 14 | rangelength: [5, 10] | 请输入长度在 5 到 10 之间的字符。 |
| 15 | min: 5 | 请输入不小于 5 的数值。 |
| 16 | max: 10 | 请输入不大于 10 的数值。 |
| 17 | range: [5, 10] | 请输入范围在 5 到 10 之间的数值。 |
根据 WxValidate.js 插件,定义 验证函数 initValidate 的规则及返回的信息,在 onLoad 生命周期中调用
使用 bindinput 、 bindblur 绑定事件和data-name传入对应的表单字段名 来实现单个输入框失焦的验证
initValidate() {//验证规则和提示信息let rulesAndMsg = {Name: {rules: {required: true},message: {required: '请输入姓名'}},IDCard: {rules: {required: true,idcard: true,},message: {required: '请输入身份证号',idcard: '请输入正确的身份证号码',}},Age: {rules: {required: true,rangeRom: [1, 120],},message: {required: '请输入年龄'}},}//实例化当前的验证规则和提示消息this.WxValidate = new WxValidate(rulesAndMsg);/*** 自定义验证规则传3个参数* name 是添加的方法的名字* method 是一个函数,value:元素的值,param是参数* message 是自定义的错误提示*/this.WxValidate.addMethod('rangeRom', (value, param) => {return this.WxValidate.optional(value) || (value >= param[0] && value <= param[1])}, '年龄范围是: 1-120');},
提交时校验
if (!this.WxValidate.checkForm(this.data.form)) {//表单元素验证不通过,此处给出相应提示this.setData({errorList: this.WxValidate.errorList,})return false;}
更改了方法具体文件点此处详见
相关文章:
小程序 表单验证
使用 WxValidate.js 插件来校验表单数据 常用实例方法 名称返回类型描述checkForm(e)boolean验证所有字段的规则,返回验证是否通过。valid()boolean返回验证是否通过。size()number返回错误信息的个数。validationErrors()array返回所有错误信息。addMethod(name…...
本地仓库推送至远程仓库
1. 本地生成ssh密钥对 ssh-keygen -t rsa -C 邮箱2. 添加公钥到gitlab/github/gitee上 打开C:\Users\用户名\.ssh目录下生成的密钥文件id_rsa.pub,把内容复制到如下文本框中 删除Expiration date显示的日期,公钥有效期变成永久,之后点Add K…...
【Unity2D】角色动画的切换
动画状态转换 第一种方法是设置一个中间状态,从中间状态向其余各种状态切换,且各状态向其他状态需要设置参数 实现动作转移时右键点击Make Transition即可 实现动画转移需要设置条件 点击一种动画到另一种动画的线 ,然后点击加号添加Condi…...
【MATLAB第62期】基于MATLAB的PSO-NN、BBO-NN、前馈神经网络NN回归预测对比
【MATLAB第62期】基于MATLAB的PSO-NN、BBO-NN、前馈神经网络NN回归预测对比 一、数据设置 1、7输入1输出 2、103行样本 3、80个训练样本,23个测试样本 二、效果展示 NN训练集数据的R2为:0.73013 NN测试集数据的R2为:0.23848 NN训练集数据的…...
深度剖析C++ 异常机制
传统排错 我们早在 C 程序里面传统的错误处理手段有: 终止程序,如 assert;缺陷是用户难以接受,说白了就是一种及其粗暴的手法,比如发生内存错误,除0错误时就会终止程序。 返回错误码。缺陷是需要我们自己…...
adb no permissions (user *** is not in the plugdev group)
首次配置ubuntu下的adb 环境,执行了adb device命令会出现以下问题 lvilvi-PC:~/develop/android/sdk/platform-tools$ adb devices List of devices attached 123699aac6536d65 no permissions (user lvi is not in the plugdev group); see [http://develo…...
【外卖系统】分类管理业务
公共字段自动填充 需求分析 对于之前的开发中,有创建时间、创建人、修改时间、修改人等字段,在其他功能中也会有出现,属于公共字段,对于这些公共字段最好是在某个地方统一处理以简化开发,使用Mybatis Plus提供的公共…...
es报错[FORBIDDEN/12/index read-only / allow delete (api)]
报错 [FORBIDDEN/12/index read-only / allow delete (api)] es磁盘满了 postman请求 put 请求 http://loclahost:9200/_settings {"settings": {"index": {"blocks": {"read_only_allow_delete": "false"}}} }...
关于网络通信安全协议的一些知识(ssl,tls,CA,https)
首先了解一下http协议的变迁。 http1.0默认短连接,1.1默认长连接并且可以管道传输,但是存在队头阻塞问题; https就是在tcp和http之间加了SSL/TLS层。 http2也是安全的,改进是hpack二进制和编码压缩减小体积,stream没有…...
Generative Diffusion Prior for Unified Image Restoration and Enhancement 论文阅读笔记
这是CVPR2023的一篇用diffusion先验做图像修复和图像增强的论文 之前有一篇工作做了diffusion先验(Bahjat Kawar, Michael Elad, Stefano Ermon, and Jiaming Song, “Denoising diffusion restoration models,” arXiv preprint arXiv:2201.11793, 2022. 2, 4, 6,…...
GAMES101 笔记 Lecture13 光线追踪1
目录 Why Ray Tracing?(为什么需要光线追踪?)Basic Ray Tracing Algorithm(基础的光线追踪算法)Ray Casting(光线的投射)Generating Eye Rays(生成Eye Rays) Recursive(Whitted-Styled) Ray Tracing Ray-Surface Intersection(光线和平面的交点)Ray Rquation(射线方…...
【多模态】21、BARON | 通过引入大量 regions 来提升模型开放词汇目标检测能力
文章目录 一、背景二、方法2.1 主要过程2.2 Forming Bag of Regions2.3 Representing Bag of Regions2.4 Aligning bag of regions 三、效果 论文:Aligning Bag of Regions for Open-Vocabulary Object Detection 代码:https://github.com/wusize/ovdet…...
2023“Java 基础 - 中级 - 高级”面试集结,已奉上我的膝盖
Java 基础(对象线程字符接口变量异常方法) 面向对象和面向过程的区别? Java 语言有哪些特点? 关于 JVM JDK 和 JRE 最详细通俗的解答 Oracle JDK 和 OpenJDK 的对比 Java 和 C的区别? 什么是 Java 程序的主类&…...
开源项目-erp企业资源管理系统(毕设)
哈喽,大家好,今天给大家带来一个开源项目-erp企业资源管理系统,项目通过ssh+oracle技术实现。 系统主要有基础数据,人事管理,采购管理,销售管理,库存管理,权限管理模块 登录 主页 基础数据 基础数据有商品类型,商品,供应商,客户,仓库管理功能...
Leetcode刷题---C语言实现初阶数据结构---单链表
1 删除链表中等于给定值 val 的所有节点 删除链表中等于给定值 val 的所有节点 给你一个链表的头节点head和一个整数val,请你删除链表中所有满足Node.valval的节点,并返回新的头节点 输入:head [1,2,6,3,4,5,6], val 6 输出:[…...
opencv hand openpose
使用opencv c 来调用caffemodel 使用opencv 得dnn 模块调用 caffemodel得程序,图片自己输入就行,不做过多得解释,看代码清单。 定义手指关节点 const int POSE_PAIRS[20][2] { {0,1}, {1,2}, {2,3}, {3,4}, // thumb {0,5}, {5,6}, {6,7}…...
flutter fl_chart 柱状图 柱条数量较多 实现左右滑动 固定y轴
一、引入插件 pub.dev:fl_chart package - All Versions 根据项目版本,安装可适配的 fl_chart 版本 二、官网柱状图示例 github参数配置:(x轴、y轴、边框、柱条数据、tooltip等) https://github.com/imaNNeo/fl_c…...
CAN学习笔记1:计算机网络
计算机网络 1 概述 计算机网络就是把多种形式的计算机用通信线路连接起来,并使其能够互相进行交换的系统。实际上,计算机网络包括了计算机、各种硬件、各种软件、组成网络的体系结构、网络传输介质和网络通信计数。因此,计算机网络是计算机…...
NAND flash的坏块
NAND flash的坏块 1.为什么会出现坏块 由于NAND Flash的工艺不能保证NAND的Memory Array(由NAND cell组成的阵列)在其生命周期中保持性能的可靠(电荷可能由于其他异常原因没有被锁起来。因此,在NAND的生产中及使用过程中会产生坏…...
代码随想录算法训练营第二十五天 | 读PDF复习环节3
读PDF复习环节3 本博客的内容只是做一个大概的记录,整个PDF看下来,内容上是不如代码随想录网站上的文章全面的,并且PDF中有些地方的描述,是很让我疑惑的,在困扰我很久后,无意间发现,其网站上的讲…...
实战利器:借助快马平台构建磁盘空间分析器,cmd命令深度应用
今天想和大家分享一个非常实用的工具开发经验——如何用cmd命令构建一个磁盘空间分析器。这个工具在我们日常系统维护和磁盘管理中特别有用,尤其是当C盘突然变红或者需要清理大文件的时候。 工具核心功能设计 这个磁盘空间分析器主要解决几个实际问题:…...
Flash Memory技术解析与应用实践
1. Flash Memory技术全景解析作为一名嵌入式系统开发工程师,我使用Flash Memory已有十余年经验。从早期的NOR Flash烧录到现在的TLC NAND优化,这项技术始终是存储领域的核心支柱。让我们抛开教科书式的定义,从实际工程角度重新认识这项既熟悉…...
KT0803K FM发射芯片Arduino驱动开发与射频工程实践
1. KT0803系列FM发射芯片Arduino库深度解析与工程实践指南1.1 芯片定位与系统级约束KT0803及其衍生型号(KT0803K/L/M)是高度集成的单芯片FM广播发射器,专为低功耗、小体积音频广播应用设计。该系列芯片内部集成了PLL频率合成器、立体声编码器…...
seo优化机构怎样选择才合适_什么是seo优化机构
SEO优化机构怎样选择才合适_什么是SEO优化机构 在当今的数字化时代,拥有一个高效的网站已经不再是企业竞争力的唯一标准,更重要的是这个网站能够在搜索引擎上获得良好的排名。这就是搜索引擎优化(SEO)的重要性所在。选择一个合适…...
个人 AI 助理——打造你的第二大脑
个人 AI 助理——打造你的第二大脑摘要:信息过载时代,个人 AI 助理不再是奢侈品,而是必需品。本文教你如何搭建专属 AI 助理,实现信息管理、知识沉淀、决策辅助的智能化,让 AI 成为你的"第二大脑"。一、为什…...
ML.NET + 1-bit LLM:在 C# 上位机实现仅 1GB 内存的本地 AI 推理
文章目录上位机程序员的内存焦虑,谁懂啊1-bit LLM是个啥?把模型"压缩裤"穿到极致ML.NET:被遗忘的.NET AI利器实战:把BitNet塞进你的上位机路子一:ONNX Runtime桥梁(最正统)路子二&…...
Phi-3-mini-4k-instruct新手入门:Ollama部署详解,从安装到第一个对话
Phi-3-mini-4k-instruct新手入门:Ollama部署详解,从安装到第一个对话 1. 认识Phi-3-mini-4k-instruct:轻量级AI助手 Phi-3-mini-4k-instruct是一个仅有38亿参数的轻量级语言模型,由微软团队开发。虽然体积小巧,但它在…...
用快马AI一键生成数据库管理原型,告别navicat手工建表写接口
用快马AI一键生成数据库管理原型,告别navicat手工建表写接口 最近在开发一个员工信息管理系统时,我深刻体会到传统数据库管理工具的局限性。虽然navicat这类工具能帮我们可视化操作数据库,但每次新建项目都要手动建表、写接口,重…...
自动药片装瓶机 No.360 三菱 组态王 基于PLC的药片装瓶自动控制系统 我们主要的后发送...
自动药片装瓶机 No.360 三菱 组态王 基于PLC的药片装瓶自动控制系统 我们主要的后发送的产品有,带解释的梯形图接线图原理图图纸,io分配,组态画面车间里那些药片装瓶机,以前人工摆瓶子、数药片,慢就算了,…...
从选型到焊接:一份给嵌入式新手的晶振避坑指南(含32.768KHz实例)
从选型到焊接:嵌入式开发者的晶振实战避坑手册 第一次点亮自己设计的电路板时,那颗小小的晶振就像电子世界的心跳起搏器。记得三年前我为一个智能家居项目调试STM32时,连续三天卡在"晶振不起振"的问题上——电路图反复检查无误&…...
