antd3 form中遍历生成多个name输入框，校验name不能重复，并且重复的项都要显示错误提示“不能重复”

在Ant Design Pro 3.x版本的Form组件中，如果你想动态生成多个名称输入框并确保它们不重复，你可以这样做：

1. 首先，创建一个状态数组来保存所有的名字，初始时设置为[]。

const [names, setNames] = useState([]);

2. 使用`Array.map()`循环生成输入框，并使用`getFieldDecorator`来自React Form控件库对每个name字段进行验证。同时，添加一个`validateFields`函数来处理验证。

<Form.Item
  label="Name"
  validateStatus={this.isNameUnique(names)}
  help={this.getValidationMessage(names)}
>
  {names.map((item, index) => (
    <Input key={index} name={`name_${index}`} value={item} onChange={(e) => this.handleInputChange(index, e.target.value)} />
  ))}
</Form.Item>

//...其他表单处理函数

isNameUnique(names) {
  // 检查当前输入的名字是否已存在数组中
  const newName = this.getFieldValue('name_' + index); // 获取当前input的值
  return !names.includes(newName);
}

getValidationMessage(names) {
  // 如果名字不唯一，返回错误消息
  if (!this.isNameUnique(names)) {
    return '这个名字已经存在了';
  }
  return '';
}

handleInputChange(index, value) {
  // 更新状态数组，并触发验证
  setNames([...names.slice(0, index), ...names.slice(index + 1), value]);
  this.validateFields([...names.slice(0, index), ...names.slice(index + 1)]);
}

这里，`isNameUnique`函数检查新输入的名字是否已经在`names`数组里，`getValidationMessage`则在名字重复时返回错误提示。每次用户更改输入时，都会更新状态数组并重新验证所有名字。