Skip to content

Commit f8fa3be

Browse files
committed
doc(Form): 文档api修改
1 parent 4194063 commit f8fa3be

File tree

1 file changed

+35
-81
lines changed

1 file changed

+35
-81
lines changed

packages/core/src/Form/README.md

Lines changed: 35 additions & 81 deletions
Original file line numberDiff line numberDiff line change
@@ -267,90 +267,44 @@ const FormComponent = Form.create(FormDemo)
267267

268268
export default FormComponent;
269269
```
270-
End
271-
272-
273-
### FormProps
274-
```ts
275-
interface FormProps<FormData = any, FieldValue = FormData[keyof FormData], FieldKey extends KeyType = keyof FormData> {
276-
/**
277-
* 表单集合
278-
*/
279-
schema?: FormItemsProps[];
280-
/**
281-
* 经 Form.useForm() 创建的 form 控制实例,不提供时会自动创建
282-
*/
283-
form: FormInstance<FormData, FieldValue, FieldKey>;
284-
/**
285-
* 表单默认值,只有初始化以及重置时生效
286-
*/
287-
initialValues?: Partial<FormData>;
288-
/**
289-
* 支持默认和卡片两种模式
290-
*/
291-
mode?:'default' | 'card';
292-
// 表单是否在onChange时进行验证
293-
changeValidate?: boolean;
294-
// 监听表单字段变化
295-
watch?: Partial<Record<string, (value: unknown) => void>>;
296-
// 自定义组件
297-
customComponentList?: Partial<Record<string, JSX.Element>>;
298-
}
299-
```
270+
271+
### Props
272+
273+
| 参数 | 说明 | 类型 | 默认值 |
274+
|------|------|-----|------|
275+
| `schema` | 表单集合 | FormItemsProps[] | [] |
276+
| `form` | 经 Form.useForm() 创建的 form 控制实例,不提供时会自动创建 | FormInstance<`FormData`, `FieldValue`, `FieldKey`> | - |
277+
| `initialValues` | 表单默认值,只有初始化以及重置时生效 | Partial<`FormData`> | - |
278+
| `mode` | 支持默认和卡片两种模式 | `default` \| `card` | | default |
279+
| `changeValidate` | 表单是否在onChange时进行验证 | boolean | false |
280+
| `watch` | 监听表单字段变化 | Partial<Record<string, (value: unknown) => void>> | - |
281+
| `customComponentList` | 自定义组件 | Partial<Record<string, JSX.Element>> | - |
300282

301283
### FormItemsProps
302-
```ts
303-
interface FormItemsProps {
304-
// 字段名
305-
field: string;
306-
// 字段类型(默认继承了react-native-uiw中的 input | textArea | slider | rate | radio | search | switch | checkBox | stepper | cardList )
307-
type: string;
308-
// 标签名
309-
name: string;
310-
// 验证规则
311-
validate?: RulesOption['validate'];
312-
options?: Array<{ label: string; value: KeyType }>;
313-
// 表单控件props
314-
attr?: any;
315-
// 展示是否必填
316-
required?: boolean;
317-
// 是否隐藏
318-
hide?:boolean
319-
// 当type为cardList生效,渲染每一项的头部内容
320-
renderHeader?:(index:number,{ remove }:{ remove:()=>void })=>React.ReactNode;
321-
// 当type为cardList生效,渲染添加按钮的文案
322-
renderAdd?:( { add }:{ add:()=>void } )=>React.ReactNode;
323-
// 当type为cardList生效,配置表单项
324-
items?: Omit<FormItemsProps, 'validate' | 'required'>[];
325-
}
326-
```
327284

328-
### FormInstance
329-
```ts
330-
type FormInstance<FormData = any, FieldValue = FormData[keyof FormData], FieldKey extends KeyType = keyof FormData> = {
331-
/**
332-
* 获取对应字段名的值
333-
*/
334-
getFieldValue: (field: FieldKey) => FieldValue;
335-
/**
336-
* 设置对应字段名的值
337-
*/
338-
setFieldValue: (field: FieldKey, value: FieldValue) => void;
339-
/**
340-
* 重制表单
341-
*/
342-
resetFieldValue: () => void;
343-
/**
344-
* 触发验证
345-
*/
346-
validate: () => Partial<Record<string, string>>;
347-
/**
348-
* 触发表单验证获取表单数据
349-
*/
350-
validateFields: () => Promise<FormData> | any;
351-
getInnerMethods: (inner?: boolean) => InnerMethodsReturnType<FormData>;
352-
};
353-
```
285+
| 参数 | 说明 | 类型 | 默认值 |
286+
|------|------|-----|------|
287+
| `field` | 字段名 | string | - |
288+
| `type` | 字段类型(默认继承了react-native-uiw中的 input | textArea | slider | rate | radio | search | switch | checkBox | stepper | cardList ) | string | - |
289+
| `name` | 标签名 | string | - |
290+
| `validate` | 验证规则 | RulesOption['validate'] | - |
291+
| `options` | 集合 | Array<{ label: string; value: KeyType }> | - |
292+
| `attr` | 表单控件props | any | - |
293+
| `required` | 展示是否必填 | boolean | - |
294+
| `hide` | 是否隐藏 | boolean | - |
295+
| `renderHeader` | 当type为cardList生效,渲染每一项的头部内容 | (index:number,{ remove }:{ remove:()=>void })=>React.ReactNode | - |
296+
| `renderAdd` | 当type为cardList生效,渲染添加按钮的文案 | ( { add }:{ add:()=>void } )=>React.ReactNode | - |
297+
| `items` | 当type为cardList生效,配置表单项 | Omit<FormItemsProps, `validate` \| `required`>[] | - |
298+
299+
### FormInstanceProps
354300

301+
| 参数 | 说明 | 类型 | 默认值 |
302+
|------|------|-----|------|
303+
| `getFieldValue` | 获取对应字段名的值 | (field: FieldKey) => FieldValue | - |
304+
| `setFieldValue` | 设置对应字段名的值 | (field: FieldKey, value: FieldValue) => void | - |
305+
| `resetFieldValue` | 重制表单 | () => void | - |
306+
| `validate` | 触发验证 | () => Partial<Record<string, string>> | - |
307+
| `validateFields` | 触发表单验证获取表单数据 | () => Promise<FormData> \| any | - |
308+
| `getInnerMethods` | 组件内部方法集合 | (inner?: boolean) => InnerMethodsReturnType<FormData> | - |
355309

356310

0 commit comments

Comments
 (0)