Skip to content

Commit 378da76

Browse files
committed
feat(Form): 增加Form.create兼容class组件使用
1 parent 43ec537 commit 378da76

File tree

3 files changed

+71
-0
lines changed

3 files changed

+71
-0
lines changed

packages/core/src/Form/README.md

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -197,6 +197,58 @@ const FormDemo = () => {
197197
```
198198
<!--End-->
199199

200+
### class组件获取form
201+
202+
<!--DemoStart-->
203+
```jsx
204+
import { SafeAreaView,View,Text } from 'react-native';
205+
import { Form,Button,Flex } from '@uiw/react-native';
206+
207+
class FormDemo extends React.Component {
208+
render(){
209+
const { form } = this.props
210+
const schema = [
211+
{
212+
type: 'input',
213+
field: 'name',
214+
name: '输入框',
215+
attr: {},
216+
required: true,
217+
validate: (val) => (!val ? `请输入name` : ''),
218+
}
219+
];
220+
return (
221+
<SafeAreaView>
222+
<Form
223+
form={form}
224+
schema={schema}
225+
initialValues={{ name: '王滴滴', rate: 4 }}
226+
watch={{
227+
name: (value: unknown) => console.log('value', value),
228+
}}
229+
customComponentList={{
230+
render: <Slider />,
231+
}}
232+
changeValidate={true}
233+
/>
234+
<Button
235+
type="primary"
236+
onPress={() => form.validateFields().then((values) => {}).catch((errors) => {}) }>
237+
确定
238+
</Button>
239+
</SafeAreaView>
240+
);
241+
}
242+
}
243+
244+
const FormComponent = Form.create(FormDemo)
245+
246+
export default FormComponent;
247+
```
248+
<!--End-->
249+
250+
251+
200252
### FormProps
201253
```ts
202254
interface FormProps<FormData = any, FieldValue = FormData[keyof FormData], FieldKey extends KeyType = keyof FormData> {
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import React from 'react';
2+
import useForm from './hooks/useForm';
3+
import { FormProps } from './types';
4+
5+
function create(Com: React.FC<FormProps>) {
6+
return (props: FormProps) => {
7+
const form = useForm();
8+
const baseProps = {
9+
...props,
10+
form: form,
11+
};
12+
return <Com {...baseProps} />;
13+
};
14+
}
15+
16+
export default create;

packages/core/src/Form/index.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,17 @@
11
import Form from './form';
2+
import create from './createForm';
23
import useForm from './hooks/useForm';
34

45
type RefForm = typeof Form;
56

67
export interface FormComponent extends RefForm {
78
useForm: typeof useForm;
9+
create: typeof create;
810
}
911

1012
const FormComp: FormComponent = Form as FormComponent;
1113

1214
FormComp.useForm = useForm;
15+
FormComp.create = create;
1316

1417
export default FormComp;

0 commit comments

Comments
 (0)