diff --git a/db/TDesign.db b/db/TDesign.db index b95b0cda4..92945e829 100644 Binary files a/db/TDesign.db and b/db/TDesign.db differ diff --git a/packages/products/tdesign-mobile-react/src/form/defaultProps.ts b/packages/products/tdesign-mobile-react/src/form/defaultProps.ts index 4cf5189ad..91bf7a0fe 100644 --- a/packages/products/tdesign-mobile-react/src/form/defaultProps.ts +++ b/packages/products/tdesign-mobile-react/src/form/defaultProps.ts @@ -23,5 +23,6 @@ export const formItemDefaultProps: TdFormItemProps = { arrow: false, label: '', requiredMark: undefined, + shouldUpdate: false, showErrorMessage: undefined, }; diff --git a/packages/products/tdesign-mobile-react/src/form/form.en-US.md b/packages/products/tdesign-mobile-react/src/form/form.en-US.md index 8f392243f..149690e45 100644 --- a/packages/products/tdesign-mobile-react/src/form/form.en-US.md +++ b/packages/products/tdesign-mobile-react/src/form/form.en-US.md @@ -12,7 +12,9 @@ colon | Boolean | false | \- | N contentAlign | String | left | options: left/right | N disabled | Boolean | undefined | \- | N errorMessage | Object | - | Typescript: `FormErrorMessage` | N +form | Object | - | Typescript: `FormInstanceFunctions` | N id | String | undefined | native id attribute of the form，which supports being used in conjunction with non-form buttons through the form attribute to trigger form events | N +initialData | Object | - | \- | N labelAlign | String | right | options: left/right/top | N labelWidth | String / Number | '81px' | \- | N preventSubmitDefault | Boolean | true | \- | N @@ -36,7 +38,14 @@ name | params | return | description className | String | - | className of component | N style | Object | - | CSS(Cascading Style Sheets)，Typescript: `React.CSSProperties` | N clearValidate | `(fields?: Array)` | \- | required +currentElement | \- | `HTMLFormElement` | \- +getCurrentElement | \- | `HTMLFormElement` | \- +getFieldValue | `(field: NamePath) ` | `unknown` | required +getFieldsValue | `(nameList: string[] \| boolean)` | `getFieldsValue` | required。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/form/type.ts)。
`interface getFieldsValue{ (nameList: true): T; (nameList: any[]): Record;}`
+getValidateMessage | `(fields?: Array)` | `Array \| void` | required reset | `(params?: FormResetParams)` | \- | required。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/form/type.ts)。
`interface FormResetParams { type?: 'initial' \| 'empty'; fields?: Array }`
+setFields | `(fields: FieldData[])` | \- | required。Typescript: `(fields: FieldData[]) => void` `interface FieldData { name: NamePath; value?: unknown, status?: string, validateMessage?: { type?: string, message?: string } }`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/form/type.ts) +setFieldsValue | `(field: Data)` | \- | required setValidateMessage | `(message: FormValidateMessage)` | \- | required。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/form/type.ts)。
`type FormValidateMessage = { [field in keyof FormData]: FormItemValidateMessage[] }`

`interface FormItemValidateMessage { type: 'warning' \| 'error'; message: string }`
submit | `(params?: { showErrorMessage?: boolean })` | \- | required validate | `(params?: FormValidateParams)` | `Promise>` | required。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/form/type.ts)。
`interface FormValidateParams { fields?: Array; showErrorMessage?: boolean; trigger?: ValidateTriggerType }`

`type ValidateTriggerType = 'blur' \| 'change' \| 'submit' \| 'all'`
@@ -53,12 +62,14 @@ arrow | Boolean | false | \- | N contentAlign | String | - | options: left/right | N for | String | - | \- | N help | TNode | - | Typescript: `string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N +initialData | String / Number / Object / Array | - | Typescript: `InitialData` `type InitialData = any`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/form/type.ts) | N label | TNode | '' | Typescript: `string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N labelAlign | String | - | options: left/right/top | N labelWidth | String / Number | - | \- | N name | String / Number / Array | - | Typescript: `NamePath` `type NamePath = string \| number \| Array`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/form/type.ts) | N requiredMark | Boolean | undefined | \- | N rules | Array | - | Typescript: `Array` | N +shouldUpdate | Boolean / Function | false | Typescript: `boolean \| ((prevValue, curValue) => boolean)` | N showErrorMessage | Boolean | undefined | \- | N ### FormRule diff --git a/packages/products/tdesign-mobile-react/src/form/form.md b/packages/products/tdesign-mobile-react/src/form/form.md index 18d352006..c36fda573 100644 --- a/packages/products/tdesign-mobile-react/src/form/form.md +++ b/packages/products/tdesign-mobile-react/src/form/form.md @@ -12,7 +12,9 @@ colon | Boolean | false | 是否在表单标签字段右侧显示冒号 | N contentAlign | String | left | 表单内容对齐方式：左对齐、右对齐。可选项：left/right | N disabled | Boolean | undefined | 是否禁用整个表单 | N errorMessage | Object | - | 表单错误信息配置，示例：`{ idcard: '请输入正确的身份证号码', max: '字符长度不能超过 ${max}' }`。TS 类型：`FormErrorMessage` | N +form | Object | - | 经 `Form.useForm()` 创建的 form 控制实例。TS 类型：`FormInstanceFunctions` | N id | String | undefined | 表单原生的id属性，支持用于配合非表单内的按钮通过form属性来触发表单事件 | N +initialData | Object | - | 表单初始数据，重置时所需初始数据，优先级小于 FormItem 设置的 initialData | N labelAlign | String | right | 表单字段标签对齐方式：左对齐、右对齐、顶部对齐。可选项：left/right/top | N labelWidth | String / Number | '81px' | 可以整体设置label标签宽度，默认为81px | N preventSubmitDefault | Boolean | true | 是否阻止表单提交默认事件（表单提交默认事件会刷新页面），设置为 `true` 可以避免刷新 | N @@ -36,7 +38,14 @@ onValuesChange | Function | | TS 类型：`(changedValues: Record)` | \- | 必需。清空校验结果。可使用 fields 指定清除部分字段的校验结果，fields 值为空则表示清除所有字段校验结果。清除邮箱校验结果示例：`clearValidate(['email'])` +currentElement | \- | `HTMLFormElement` | 获取 form dom 元素 +getCurrentElement | \- | `HTMLFormElement` | 获取 form dom 元素 +getFieldValue | `(field: NamePath) ` | `unknown` | 必需。获取单个字段值 +getFieldsValue | `(nameList: string[] \| boolean)` | `getFieldsValue` | 必需。获取一组字段名对应的值，当调用 getFieldsValue(true) 时返回所有表单数据。[详细类型定义](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/form/type.ts)。
`interface getFieldsValue{ (nameList: true): T; (nameList: any[]): Record;}`
+getValidateMessage | `(fields?: Array)` | `Array \| void` | 必需。获取校验结果，当调用 getValidateMessage() 时返回所有校验结果 reset | `(params?: FormResetParams)` | \- | 必需。重置表单，表单里面没有重置按钮`