react的antd表单校验,禁止输入空格并触发校验提示

首先需要用到form组件,在form.item内添加rules属性,写正则表达式

TypeScript 复制代码
<Form.Item
  label="员工姓名"
  name="name"
  rules={[
    { required: true, message: '员工姓名' },
    { pattern: /^(?!\s*$).+$/, message: '不能全是空格' },
   ]}
  >
<Input placeholder="请输入员工姓名" />
</Form.Item>

关键代码:{ pattern: /^(?!\s*).+/, message: '不能全是空格' }

相关推荐
拖拉斯旋风4 分钟前
深入浅出 RAG:从网页爬取到智能问答的完整链路解析
前端
Mintopia17 分钟前
Vite 发展现状与回顾:从“极致开发体验”到生态基础设施
前端
前端双越老师41 分钟前
前端面试常见的 10 个场景题
前端·面试·求职
孟祥_成都2 小时前
【全网最通俗!新手到AI全栈开发必读】 AI 是如何进化到大模型的
前端·人工智能·全栈
牛奶2 小时前
AI辅助开发的基础概念
前端·人工智能·ai编程
摸鱼的春哥2 小时前
Agent教程15:认识LangChain,Agent框架的王(上)
前端·javascript·后端
明月_清风3 小时前
自定义右键菜单:在项目里实现“选中文字即刻生成新提示”
前端·javascript
明月_清风3 小时前
告别后端转换:高质量批量导出实战
前端·javascript
刘发财8 小时前
弃用html2pdf.js,这个html转pdf方案能力是它的几十倍
前端·javascript·github
牛奶10 小时前
2026年大模型怎么选?前端人实用对比
前端·人工智能·ai编程