Skip to content

Commit fe5e6e5

Browse files
authored
fix: Form.List nested not support preserve=false (#583)
* test: test driven * fix: List should also support isFieldList
1 parent cbc2bc6 commit fe5e6e5

File tree

2 files changed

+47
-0
lines changed

2 files changed

+47
-0
lines changed

src/List.tsx

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,9 @@ export interface ListProps {
2929
operations: ListOperations,
3030
meta: Meta,
3131
) => JSX.Element | React.ReactNode;
32+
33+
/** @private Passed by Form.List props. Do not use since it will break by path check. */
34+
isListField?: boolean;
3235
}
3336

3437
const List: React.FunctionComponent<ListProps> = ({
@@ -37,6 +40,7 @@ const List: React.FunctionComponent<ListProps> = ({
3740
children,
3841
rules,
3942
validateTrigger,
43+
isListField,
4044
}) => {
4145
const context = React.useContext(FieldContext);
4246
const keyRef = React.useRef({
@@ -87,6 +91,7 @@ const List: React.FunctionComponent<ListProps> = ({
8791
validateTrigger={validateTrigger}
8892
initialValue={initialValue}
8993
isList
94+
isListField={isListField}
9095
>
9196
{({ value = [], onChange }, meta) => {
9297
const { getFieldValue } = context;

tests/preserve.test.tsx

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -403,4 +403,46 @@ describe('Form.Preserve', () => {
403403

404404
expect(container.querySelector<HTMLInputElement>('input')?.value).toEqual('bamboo');
405405
});
406+
407+
it('nest Form.List should clear correctly', async () => {
408+
const { container } = render(
409+
<Form
410+
preserve={false}
411+
initialValues={{
412+
parent: [[{ name: 'bamboo' }]],
413+
}}
414+
>
415+
<Form.List name="parent">
416+
{(fields, { remove }) => {
417+
return fields.map(field => (
418+
<div key={field.key}>
419+
<button
420+
onClick={() => {
421+
remove(field.name);
422+
}}
423+
/>
424+
<Form.List {...field} name={[field.name]}>
425+
{childFields =>
426+
childFields.map(childField => (
427+
<div key={childField.key}>
428+
<Form.Field {...childField} name={[childField.name, 'name']}>
429+
<input />
430+
</Form.Field>
431+
</div>
432+
))
433+
}
434+
</Form.List>
435+
</div>
436+
));
437+
}}
438+
</Form.List>
439+
</Form>,
440+
);
441+
442+
expect(container.querySelector('input').value).toEqual('bamboo');
443+
444+
// Clean
445+
fireEvent.click(container.querySelector('button'));
446+
expect(container.querySelector('input')).toBeFalsy();
447+
});
406448
});

0 commit comments

Comments
 (0)