form表单调接口校验 比如后台验证用户名是否存在
<FormItem {...formItemLayout} label={'显示名'}>
{getFieldDecorator('displayName', {
initialValue: displayName,
validateTrigger: 'onBlur',
rules: [
{ transform: val => val && val.trim() },
{ required: true, message: '请输入显示名' },
{ max: 20, message: '显示名长度必须小于等于20字符' },
{
validator: (rlue, value, cb) => {
if (value) {
checkNickname(value).then((res) => {
const { success, data } = res;
// 接口成功
if (success) {
// 存在重名
if (data.hasDisplayName) {
this.props.setFields({
displayName: {
value: displayName,
errors: [new Error('此显示名已被使用!')],
},
})
} else {
cb();
}
}
})
} else {
cb();
}
}
}
]
})(
<Input />
)}
</FormItem>
注意cb回调
form表单调接口校验 比如后台验证用户名是否存在的更多相关文章
- Element Ui使用技巧——Form表单的校验规则rules详细说明
Element UI中对Form表单验证的使用介绍: Form 组件提供了表单验证的功能,只需要通过 rules 属性传入约定的验证规则,并将 Form-Item的 prop 属性设置为需校验的字段名 ...
- 如何把整张表格的数据通过form表单的方式传回后台
开发背景: 前段时间遇到这么一个需求,就是把一整张表格的数据存储在数据库中,之后再渲染在页面中,还可以进行重新编辑. 例如下边的课程表(为了方便,所以都是软件工程). 我也是经过一段时间的思考,才实现 ...
- form表单提交校验
<form id="myForm" action="http://www.365mini.com" method="post"> ...
- 关于form表单或者Ajax向后台发送数据时,数据格式的探究
最近在做一个资产管理系统项目,其中有一个部分是客户端向服务端发送采集到的数据的,服务端是Django写的,客户端需要用rrequests模块模拟发送请求 假设发送的数据是这样的: data = {'s ...
- js form表单的校验
if(!$("#form").validate().form()){ return false;} <元素 class="required">< ...
- jQuery动态创建form表单并提交到后台(携带一定的数据进行页面跳转)
今天遇到这么一个需求,携带一个编号一个名字跳转到另一个JSP页面,直接页面跳转(get携带数据)的话不太安全,于是想到到后台转发一下. 第一种:直接以表单提交方式的进行 JS代码: var form ...
- form表单提交数据给后台
1.完整登录示例 1. form表单往后端提交数据注意三点 1.所有获取用户输入标签都应该放在form表单里面 2.action属性控制往哪儿提交,method一般都是设置成post 3.提交按钮必须 ...
- 从零开始学 Web 之 Ajax(四)接口文档,验证用户名唯一性案例
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- 基于form表单的极验滑动验证小案例
01.目录展示 02.url.py urlpatterns = [ path('admin/', admin.site.urls), path('login/',views.login), path( ...
- JS form表单数据校验及失效情况下的解决方案
如下图,当执行提交操作之前,我们需要对序号,要求完成时间,责任人,措施内容四项进行非空,字符长度及输入内容的类型进行校验. 直接贴样式代码 <div class="wrapper an ...
随机推荐
- 【Springboot】拦截器
Springboot 拦截器 1.什么是拦截器? 拦截器可以根据 URL 对请求进行拦截,主要应用于登陆校验.权限验证.乱码解决.性能监控和异常处理等功能. 2.定义拦截器步骤 在 Spring Bo ...
- 关于ChatGPT与机器时代的展望
关于 ChatGPT 与机器时代的展望 机器人这一概念,最初不是出自计算机科学家或工程师之手,而是来自于捷克的戏剧家卡雷尔·恰佩克(Karl Capek)在 1920 年编排的一出名为"罗森 ...
- Centos7下Oracle启动命令
1.查询挂载历史记录 在root账户下使用一下命令 查看历史使用挂载的那个磁盘 # 查看挂载历史命令 history | grep mount # 调用挂载历史命令,主要是为了找到挂载Oracle的磁 ...
- (数据科学学习手札153)基于martin的高性能矢量切片地图服务构建
本文示例代码已上传至我的Github仓库https://github.com/CNFeffery/DataScienceStudyNotes 1 简介 大家好我是费老师,在日常研发地图类应用的场景中, ...
- python连接 Basler pylon相机遇到的问题
今天使用下图程序去连接相机 以下是摄像头IP参数 电脑IP参数 在确认电脑能够ping通相机的情况下 以及检查专用软件能否访问之后 依然遇到了以下错误 经过了多番调试之后发现即使能够ping通,子网掩 ...
- 文心一言 VS 讯飞星火 VS chatgpt (67)-- 算法导论6.5 6题
文心一言 VS 讯飞星火 VS chatgpt (67)-- 算法导论6.5 6题 六.在 HEAP-INCREASE-KEY 的第 5 行的交换操作中,一般需要通过三次赋值来完成.想一想如何利用IN ...
- Cilium系列-14-Cilium NetworkPolicy 简介
系列文章 Cilium 系列文章 前言 今天我们进入 Cilium 安全相关主题, 介绍 Kubernetes 网络策略以及 CiliumNetworkPolicies 额外支持的内容. 网络策略(N ...
- win10安装mysql5.7.35教程
前提条件:我下载的是压缩包版本5.7.35,下载地址是 https://downloads.mysql.com/archives/community/ 下载完后解压,并在如下图目录里加入data文件夹 ...
- .NET周刊【8月第2期 2023-08-14】
本周由于Myuki大佬感染新冠,国际板块暂停更新一周,将在下周补齐,所以本周只有国内板块. 国内文章 解决 Blazor 中因标签换行导致的行内元素空隙问题 https://www.cnblogs.c ...
- 【日常踩坑】修复 chrome 打不开微信或者部分第三方应用内链接
目录 默认浏览器为 chrome 时,打不开微信或者部分第三方应用内链接(或者没有反应) 修复问题:卸载 KGChromePlugin 参考资料 默认浏览器为 chrome 时,打不开微信或者部分第三 ...