我有这个结构,如下图所示。这些是我可以添加的字段,限制是三个。对这些字段进行验证,如果车辆的牌照是正确的,则进行验证。如果车辆的牌照是无效的,它将显示错误信息,但该信息在另一个下面。如何将此错误消息正确地放在每个字段下?
<S.FormAddPlate>
{fields.map((field) => (
<>
<Form.Item
{...field}
validateTrigger={["onChange", "onBlur"]}
hasFeedback
key={field.key}
rules={[
{
pattern: validationPlate,
message: useTranslation({ id: "invalid_plate" }),
},
]}
noStyle
>
<Input
maxLength={7}
onKeyPress={(e) => {
validatePlate(e, validationSpecialCharacters);
}}
/>
</Form.Item>
</>
))}
<Form.Item>
{fieldsCount < 3 && (
<S.AddButtonPlate
onClick={() => {
add();
setFieldsCount(fieldsCount + 1);
}}
icon={<PlusOutlined className="addButton" />}
></S.AddButtonPlate>
)}
<Form.ErrorList errors={errors} />
</Form.Item>
</S.FormAddPlate>
);
发布于 2021-05-04 19:38:06
移除Form.Item上的Form.Item属性对我是有效的。
发布于 2021-03-20 19:19:40
根据文档和代码,您不需要这一行:
<Form.ErrorList errors={errors} />
检查此演示程序(来自Ant文档):https://codesandbox.io/s/kli3h?file=/index.js:3032-3034
https://stackoverflow.com/questions/66725210
复制相似问题