How to add validation rules to Antd Form.List

Viewed 2075

I have a form which contains a Form.List. It will be used to add songs to an album.

I want to make sure that an album contains at least one song, but Form.List only has the props name and children.

How can I validate this?

Thanks

2 Answers
<Form.List 
name="names"
>
  {fields => (
    <div>
      {fields.map(field => (
        <Form.Item {...field}>
          <Input />
        </Form.Item>
      ))}
    </div>
  )}
</Form.List>

This is the solution from antd docs. From my experience I can add this handy methods and errors inside a Form.List children render method besides.

 <Form.List
        name="names"
      >
        {(fields, { add, remove }, { errors }) => (
...

make a condition to see if the album contains at least one song. If not, Do not render the form.list If yes, render the form.list

Related