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 ...
随机推荐
- Qt/C++加载不同的地图控件/地图类型/缩放标尺/缩略图/比例尺/实时路况/全景视图等
一.前言说明 在展示地图的时候,有些常规的操作,比如调整地图的缩放级别,切换到卫星图等,希望能够在地图上直接操作实现,于是就有了一堆地图控件,可以根据自己的需求动态的添加和删除,这样就更直接更快捷,而 ...
- Qt编写地图综合应用51-离线瓦片地图下载
一.前言 写这个离线地图下载器的初衷,就是为了方便自己的几个需要离线地图的程序,客户需求,既然地图程序已经可以支持离线地图,那如何获取到这些离线瓦片地图文件是个关键,而且这是这个功能的关键,拿到这些一 ...
- Qt6中重大改变的QtMultimedia多媒体模块
一.前言 Qt 6.2 的第一个测试版刚刚发布,并在多个其他新附加组件中加入了全新的 Qt 多媒体模块.Qt Multimedia 是一个模块,它在 Qt 6 中发生了一些相当大的变化. 在很多方面, ...
- 如何使用图片的exif信息计算相机焦距
135胶卷源于35mm高度的打孔电影胶片,1913年,德国人奥斯卡·巴纳克将其用于他发明的徕卡(Leica)牌小型照相机上,由此形成标准.35mm电影胶卷,35mm指的是胶卷的高度为35mm,由于上下 ...
- 解密Prompt45. 再探LLM Scalable Oversight -辩论、博弈哪家强
之前我们已经介绍过几个针对Scalable Oversight的解法,也就是当模型能力在部分领域超越人类标注者后,我们该如何继续为模型提供监督信号,包括 持续提升Verifier的能力,辅助人类提供监 ...
- Commit规范
Commit规范 遵循commit规范是一件很重要的事,不仅更规范,而且也方便其他人查看git记录,所以这篇博客就用来浅记一下commit需要遵循的基本规范. commit格式 在 Angular 规 ...
- 使用Vue+ElementUI实现前端分页
背景 项目中要做一个公共的附件展示列表,针对某个模块某条记录展示,因此附件不会是大数据量,采用前端分页,使用Vue.JS+ElementUI布局展示,axios请求数据. 步骤 一.Html页面中引入 ...
- 微服务实战系列(十一)-微服务之自定义脚手架-copy
微服务实战系列(十一)-微服务之自定义脚手架 1. 场景描述 (1)随着微服务越来越常见,一个大的项目会被拆分成多个小的微服务,jar包以及jar之间的版本冲突问题,变得越来越常见,如何保持整体微 ...
- rabbitmq部署及配置与验证-copy
1. 场景描述 朋友项目需要弄个测试环境,稍微帮忙了下,系统不复杂,但是需要自己安装mysql.Reids.Es.RabbitMq等,Mq主要用在同步用户信息与发送站内消息和短信上,RabbitMq以 ...
- C语言中的窗口滑动技术
学习文章:C语言中的窗口滑动技术 滑动窗口法 C语言中的窗口滑动技术 循环几乎是每个复杂问题的一部分.太多的循环/嵌套循环会增加所需的时间,从而增加程序的时间复杂性.窗口滑动技术是一种计算技术,用于减 ...