Antd的validator自定义校验导致其它校验规则失效

最新推荐文章于 2024-08-16 14:32:16 发布

天府第5街①号切图仔

最新推荐文章于 2024-08-16 14:32:16 发布

阅读量2.5k

点赞数

文章标签： javascript reactjs es6

本文为博主原创文章，未经博主允许不得转载。

本文链接：https://blog.csdn.net/hemyweb/article/details/105639437

版权

本文介绍了在使用Ant Design（Antd）时遇到的一个问题，即自定义的validator校验函数导致其他预设的校验规则失效。作者通过查证和实践，发现解决方案在于在validator的所有逻辑中都包含回调(callback)或使用Promise，以确保不影响其他验证规则的执行。针对Antd V4，需使用Promise进行改造。

摘要由CSDN通过智能技术生成

<FormItem
  label="新账号"
  name="phone"
  rules={
   [
    {
    required: true, message: "不能为空" },
    {
    max: 20, message: "最长20个字符" },
    {
   
      whitespace: true,
      message: "不能输入空格",
    },
    {
   
      type: "number",
      transform: (val) => Number(val),
      message: "只能输入数字",
    },
    {
   
      validator: this.onChe