如何实现Antd Form校验仅显示红色边框，不展示错误提示文本？

实现方案分为两种，可按需选择：

方案1：仅针对单个表单项配置 #

给需要隐藏错误提示的Form.Item添加help={null}属性即可，校验失败时仅保留输入框红色边框，不渲染错误提示文本：

<Form.Item name='tue' help={null}>
  <InputNumberStyled style={{ borderRadius: '10px', width: '60px' }} min={0} max={1000} />
</Form.Item>

方案2：全局对所有表单项生效 #

如果需要所有表单项都不显示错误提示，直接在Form组件上统一配置formItemProps即可，无需逐个修改Form.Item：

<Form 
  onFinish={handleSubmit} 
  onFinishFailed={onFinishFailed} 
  autoComplete='off'
  formItemProps={{ help: null }}
>
...
      <td>
        <Form.Item name='tue'>
          <InputNumberStyled style={{ borderRadius: '10px', width: '60px' }} min={0} max={1000} />
        </Form.Item>
      </td>
...
</Form>

兜底CSS方案 #

如果上述配置不生效，也可以通过CSS直接隐藏错误提示DOM：

/* 适配Ant Design V4/V5版本 */
.ant-form-item-explain {
  display: none !important;
}

内容的提问来源于stack exchange，提问作者qweezz