antd Form.List嵌套Form.List

最近在做需求的时候，需要数组嵌套数组的形式，数据格式像这样[[],[],[]],研究了一下最后找到了方法,如下：

<Form.List name='big_rewards_list'>
 {(fields, { add, remove }) => (
   <>
     {fields.map((field, index) => (
       <Space
         key={field.key}
         align='baseline'
       >
       //这里的name就是子List,这样写就是[],正常情况是name={[field.name, 'type']}
         <Form.List {...field} name={[field.name]} fieldKey={[index]} initialValue={[{}]}>
           {(SonList, { add: addSon, remove: removeSon }) => (
             <>
               {SonList.map((ItemSon, indexSon) => {
                 return (
                   <Space key={ItemSon.key} align='baseline'>
                     <Form.Item
                       {...ItemSon}
                       label='奖励类型'
                       name={[ItemSon.name, 'type']}
                       fieldKey={[ItemSon.name, 'type']}
                     >
                       <Select
                         style={{ width: 160 }}
                       >
                         <Option key={1} value={1}>1</Option>
                         <Option key={2} value={2}>2</Option>
                       </Select>
                     </Form.Item>
                     <Form.Item
                       {...ItemSon}
                       label={'数量'}
                       name={[ItemSon.name, 'num']}
                       fieldKey={[ItemSon.name, 'num']}
                     >
                       <InputNumber min={0} />
                     </Form.Item>
                     <MinusCircleOutlined onClick={() => removeSon(ItemSon.name)} />
                   </Space>
                 );
               })}
               <Form.Item>
                 <Button
                   type='dashed'
                   style={{ minWidth: 480 }}
                   onClick={() => addSon()}
                   block
                   icon={<PlusOutlined />}
                 >
                   增加子项
                 </Button>
               </Form.Item>
             </>
           )}
         </Form.List>
         <DeleteOutlined onClick={() => remove(field.name)} />
       </Space>
     ))}

     <Form.Item wrapperCol={{ offset: 1 }}>
       <Button type='dashed' onClick={() => add()} block icon={<PlusOutlined />}>
         增加父级
       </Button>
     </Form.Item>
   </>
 )}
</Form.List>

最终数据结构为[[num: 17 ,type: 1],[num: 23,type:2]]