NO.2 FormList 极简用法
FormList是为了表单种具有多数据Array形式(类似批量)，话不多说，直接盗图！
image.png
import React from "react";
import { Form, Input, Row, Col, Button } from "antd";
//initalValue.files 有一元素 可直接显示一行样式 可以实验性看下样式
//可以看到 { add , remove } 暴漏的这两个方法显而易见可用来添加删除项
//可各种组合 华山论剑
export default () => (
<Form initialValues={{ files : [{ file : '' , name : '' }] }}>
<Form.Item label="文件">
<Form.List name="files">
{
( fields , { add, remove }) => fields.map(
field => (
<>
<Row key={ field.key }>
<Col span={ 11 }>
<Form.Item name={[ field.name , 'file']}>
<Input />
</Form.Item>
</Col>
<Col span={ 11 }>
<Form.Item name={[ field.name , 'name']}>
<Input />
</Form.Item>
</Col>
<Col span={ 2 } onClick={ remove( field.name ) }>x</Col>
</Row>
<Row>
<Button onClick={ add( field.name ) }>添加一行</Button>
</Row>
</>
)
)
}
</Form.List>
</Form.Item>
</Form>
);
如上代码
