ant-design-pro 自定义表单 rules规则
表单输入
<ProFormText
name="id"
label={intl.formatMessage({ id: 'pages.secret.form.id' })}
width="sm"
rules={[{ validator: checkKeyword }]}
/>
自定义校验
// 自定义关键字规则
const checkKeyword = (rule: any, value: any, callback: any) => {
if (!value) {
callback("内容不能为空!");
} else if (value === "1") {
callback("内容不能为1,请您检查!");
}
// callback();
// warning: `callback` is deprecated. Please return a promise instead.
return Promise.resolve();
};
在表单中校验
<ProFormTextArea
name="apiKey"
label="apiKey"
width="xl"
placeholder={intl.formatMessage({ id: 'pages.secret.form.apiKey.placeholder' })}
rules={[
() => ({
validator(_, value) {
if (!value) {
return Promise.reject(new Error("这里不能为空"));
}
if (value instanceof Object) {
return Promise.reject(new Error("请输入正确数据格式"));
}
return Promise.resolve();
},
required: true,
}),
]}
/>
ant-design-pro 自定义表单 rules规则的更多相关文章
- jquery.validate.js使用之自定义表单验证规则
jquery.validate.js使用之自定义表单验证规则,下面列出了一些常用的验证法规则 jquery.validate.js演示查看 jquery validate强大的jquery表单验证插件 ...
- Element-ui中自定义表单校验规则
先看一个场景图: 给一个标签el-tag添加表单的校验,且在内容有了以后关闭校验 看代码: <el-form-item class="baseinfo-tags" label ...
- 文档驱动 —— 表单组件(五):基于Ant Design Vue 的表单控件的demo,再也不需要写代码了。
源码 https://github.com/naturefwvue/nf-vue3-ant 特点 只需要更改meta,既可以切换表单 可以统一修改样式,统一升级,以最小的代价,应对UI的升级.切换,应 ...
- jquery.validate.js之自定义表单验证规则
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- Django 表单校验 表单字段设置 自定义表单校验规则
今天看到了一篇非常好的博文,拿来和大家分享一下. 内容包括了: 用户注册时输入数据的校验 使用widget进行字段设置 实现自定义的校验规则 参考自下面的这篇文章
- vue + element 实现登录注册(自定义表单验证规则)
注册页包含手机验证码登录和密码的二次验证. 效果如下: 实现代码: <template> <div> <div class="register-wrapper& ...
- ant design pro如何实现分步表单时,返回上一步值依然被保存
首先,分步表单ant design pro支持,看官方Demo即可,那么如何实现如题,关键在于设置initialValue {getFieldDecorator('name', { initialVa ...
- 实现Ant Design 自定义表单组件
Ant Design 组件提供了Input,InputNumber,Radio,Select,uplod等表单组件,但实际开发中这是不能满足需求,同时我们希望可以继续使用Form提供的验证和提示等方法 ...
- ant design pro (十三)advanced 错误处理
一.概述 原文地址:https://pro.ant.design/docs/error-cn 二.详细 2.1.页面级报错 2.1.1.应用场景 路由直接引导到报错页面,比如你输入的网址没有匹配到任何 ...
- (二)React Ant Design Pro + .Net5 WebApi:前端环境搭建
首先,你需要先装一个Nodejs,这是基础哦.如果没有这方面知识的小伙伴可以在园子里搜索cnpm yarn等关键字,内容繁多,此不赘述,参考链接 一. 简介 1. Ant Design Pro v5 ...
随机推荐
- 龙哥量化:通达信的函数ma均线,ema、sma、dma的计算原理是什么,XMA是未来函数
注意均线也有未来函数,常见的是跨周期的用法,会导致信号闪烁, 不常见的是XMA这个未来函数太坑了, [代写公式,龙哥微信:Long622889] MA.EMA.SMA.DMA.TMA.WMA6种平均算 ...
- 获取不同型号手机小程序导航栏的高度(uniapp)
uni.getSystemInfo({ success: function(e) { Vue.prototype.StatusBar = e.statusBarHeight; let custom = ...
- 内存吞金兽(Elasticsearch)的那些事儿 -- 写入&检索原理
系列目录 内存吞金兽(Elasticsearch)的那些事儿 -- 认识一下 内存吞金兽(Elasticsearch)的那些事儿 -- 数据结构及巧妙算法 内存吞金兽(Elasticsearch)的那 ...
- VS2022 没有MAUI模板的解决方法
原来是要安装 VS 2022 Preview 就是预览版.正式版还没有MAUI..... 以下的尝试都是蛋疼,没有卵用. 命令行窗口输入:dotnet workload install maui VS ...
- MySQL主从复制与读写分离原理
目录1 主从复制与读写分离的意义 1.1 什么是主从复制 1.2 主从数据库的好处和缺点 2 主从复制 2.1 主从复制的形式 2.2 主从复制的原理 2.3 主从复制的模式 异步模式 半同步模式 - ...
- biancheng-Python教程
目录http://c.biancheng.net/python/ 1Python编程基础2Python编程环境搭建3变量类型和运算符4列表.元组.字典和集合5Python字符串常用方法6Python流 ...
- 【java提高】---细则(2)
TreeSet(一) 一.TreeSet定义: 与HashSet是基于HashMap实现一样,TreeSet同样是基于TreeMap实现的. 1)TreeSet类概述 ...
- C 将十进制数转换成二~十六进制数中的任意一种
问题:将一个十进制整数转换成二~十六进制数中的任意一种进制数 代码: #include <stdio.h> #include <stdlib.h> int b; int i = ...
- day05-面向对象编程:基础语法
Java面向对象:类的基础语法 [ 任务列表 ] 1.面向对象快速入门 2.什么是面向对象 3.类的基础语法--构造器 4.类的基础语法--this关键字 5.类的基础语法--封装 6.类的基础语法- ...
- 十. Redis 事务和 “锁机制”——> 并发秒杀处理的详细说明
十. Redis 事务和 "锁机制"--> 并发秒杀处理的详细说明 @ 目录 十. Redis 事务和 "锁机制"--> 并发秒杀处理的详细说明 1 ...