Skip to content

Commit cf5bb84

Browse files
committed
docs: revert demo
1 parent 1f773ed commit cf5bb84

File tree

1 file changed

+27
-33
lines changed

1 file changed

+27
-33
lines changed

docs/examples/basic.tsx

Lines changed: 27 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,37 @@
1+
import Form, { Field } from 'rc-field-form';
12
import React from 'react';
2-
import Form, { Field, FormInstance } from 'rc-field-form';
33
import Input from './components/Input';
44

55
export default () => {
66
const [form] = Form.useForm();
7-
const [show, setShow] = React.useState(true);
8-
const [timeoutShow, setTimeoutShow] = React.useState(show);
9-
10-
React.useEffect(() => {
11-
if (show) {
12-
console.log(
13-
'show',
14-
);
15-
form.setFieldsValue({
16-
name: '123',
17-
});
18-
}
19-
20-
const id = setTimeout(() =>{
21-
setTimeoutShow(show);
22-
}, 300);
23-
24-
return () => clearTimeout(id);
25-
}, [show]);
267

8+
return (
9+
<Form form={form} preserve={false}>
10+
<Field name="name">
11+
<Input placeholder="Username" />
12+
</Field>
2713

14+
<Field dependencies={['name']}>
15+
{() => {
16+
return form.getFieldValue('name') === '1' ? (
17+
<Field name="password">
18+
<Input placeholder="Password" />
19+
</Field>
20+
) : null;
21+
}}
22+
</Field>
2823

29-
return (
30-
<>
31-
<button onClick={() =>{
32-
setShow(!show);
33-
}}>Trigger</button>
34-
{
35-
timeoutShow && <Form form={form}>
36-
<Form.Field name="name">
37-
<Input />
38-
</Form.Field>
39-
</Form>
40-
}
41-
</>
24+
<Field dependencies={['password']}>
25+
{() => {
26+
const password = form.getFieldValue('password');
27+
console.log('>>>', password);
28+
return password ? (
29+
<Field name="password2">
30+
<Input placeholder="Password 2" />
31+
</Field>
32+
) : null;
33+
}}
34+
</Field>
35+
</Form>
4236
);
4337
};

0 commit comments

Comments
 (0)