From 1ada1823fd63c299045cbd33f3e5c723535dae2d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?w=C5=AB=20y=C4=81ng?= Date: Mon, 9 Dec 2024 23:59:22 +0800 Subject: [PATCH] feat(form): support number key (#488) --- db/TDesign.db | Bin 1003520 -> 1003520 bytes .../tdesign-react/src/form/defaultProps.ts | 1 + .../tdesign-react/src/form/form.en-US.md | 1 + .../products/tdesign-react/src/form/form.md | 1 + .../products/tdesign-react/src/form/type.ts | 5 +++ packages/scripts/api.json | 37 ++++++++++++++++++ 6 files changed, 45 insertions(+) diff --git a/db/TDesign.db b/db/TDesign.db index db003d6f9e415d42d63c974852ad6086d7b48283..806b6274c016471fe886c2caa6864b99f3dc9496 100644 GIT binary patch delta 587 zcmZozVB4_3c7ilx>_i!7)>sC;vaZII))dCp6sFb`=GGLJ))dy(6t>nB_N^%#3;c!H zIVu?V+8jv2exH-l;FAtb5w9=l!0Zr*l>q>RIX;Kkw{#HfPP#34I{> z`rfI}cegy*y$xarvUa$}7u`#r?CyOzr{Tr2#wYvdKA$=hSs9QGGGRyevjy!yTVAZ+ z{nB_N^%#3;c!H zxJ(%M+>T`iBq>4H*+-D^oKg10y3{Ljzr7Lj^-aE3gn(G=s-< zf#+P3(;0&}wAt$>D*+7_o}LiMA;v1|5R#Zaec^j9{pmbU_&8Y_Rpu(Tn?!K{F((jn z0Wmia^8hjLc9ST+3#^Pb+gTI%s+p!=Na8ctz9ETEpOf*!^at5|&)Cwq@7eIY*?uO6 H&*U)x78g`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N submitWithWarningMessage | Boolean | false | \- | N +supportNumberKey | Boolean | true | support using numbers as form key values or not. Form supports numbers as key values since 1.9.3, set supportNumberKey as false If you still need to retain numbers as array subscripts | N onReset | Function | | Typescript:`(context: { e?: FormResetEvent }) => void`
| N onSubmit | Function | | Typescript:`(context: SubmitContext) => void`
[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/form/type.ts)。
`interface SubmitContext { e?: FormSubmitEvent; validateResult: FormValidateResult; firstError?: string; fields?: any }`

`type FormValidateResult = boolean \| ValidateResultObj`

`type ValidateResultObj = { [key in keyof T]: boolean \| ValidateResultList }`

`type ValidateResultList = Array`

`type AllValidateResult = CustomValidateObj \| ValidateResultType`

`interface ValidateResultType extends FormRule { result: boolean }`

`type ValidateResult = { [key in keyof T]: boolean \| ErrorList }`

`type ErrorList = Array`
| N onValuesChange | Function | | Typescript:`(changedValues: Record, allValues: Record) => void`
| N diff --git a/packages/products/tdesign-react/src/form/form.md b/packages/products/tdesign-react/src/form/form.md index 753ccc00..2e26e884 100644 --- a/packages/products/tdesign-react/src/form/form.md +++ b/packages/products/tdesign-react/src/form/form.md @@ -27,6 +27,7 @@ scrollToFirstError | String | - | 表单校验不通过时,是否自动滚动 showErrorMessage | Boolean | true | 校验不通过时,是否显示错误提示信息,统一控制全部表单项。如果希望控制单个表单项,请给 FormItem 设置该属性 | N statusIcon | TNode | undefined | 校验状态图标,值为 `true` 显示默认图标,默认图标有 成功、失败、警告 等,不同的状态图标不同。`statusIcon` 值为 `false`,不显示图标。`statusIcon` 值类型为渲染函数,则可以自定义右侧状态图标。TS 类型:`boolean \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N submitWithWarningMessage | Boolean | false | 【讨论中】当校验结果只有告警信息时,是否触发 `submit` 提交事件 | N +supportNumberKey | Boolean | true | 是否支持使用数字作为表单键值,在1.9.3版本后表单组件支持数字作为键值,若仍需要保留数字作为数组下标,请关闭此API | N onReset | Function | | TS 类型:`(context: { e?: FormResetEvent }) => void`
表单重置时触发 | N onSubmit | Function | | TS 类型:`(context: SubmitContext) => void`
表单提交时触发。其中 `context.validateResult` 表示校验结果,`context.firstError` 表示校验不通过的第一个规则提醒。`context.validateResult` 值为 `true` 表示校验通过;如果校验不通过,`context.validateResult` 值为校验结果列表。
【注意】⚠️ 默认情况,输入框按下 Enter 键会自动触发提交事件,如果希望禁用这个默认行为,可以给输入框添加 enter 事件,并在事件中设置 `e.preventDefault()`。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/form/type.ts)。
`interface SubmitContext { e?: FormSubmitEvent; validateResult: FormValidateResult; firstError?: string; fields?: any }`

`type FormValidateResult = boolean \| ValidateResultObj`

`type ValidateResultObj = { [key in keyof T]: boolean \| ValidateResultList }`

`type ValidateResultList = Array`

`type AllValidateResult = CustomValidateObj \| ValidateResultType`

`interface ValidateResultType extends FormRule { result: boolean }`

`type ValidateResult = { [key in keyof T]: boolean \| ErrorList }`

`type ErrorList = Array`
| N onValuesChange | Function | | TS 类型:`(changedValues: Record, allValues: Record) => void`
字段值更新时触发的回调事件 | N diff --git a/packages/products/tdesign-react/src/form/type.ts b/packages/products/tdesign-react/src/form/type.ts index 649b65bf..66b8804f 100644 --- a/packages/products/tdesign-react/src/form/type.ts +++ b/packages/products/tdesign-react/src/form/type.ts @@ -93,6 +93,11 @@ export interface TdFormProps { * @default false */ submitWithWarningMessage?: boolean; + /** + * 是否支持使用数字作为表单键值,在1.9.3版本后表单组件支持数字作为键值,若仍需要保留数字作为数组下标,请关闭此API + * @default true + */ + supportNumberKey?: boolean; /** * 表单重置时触发 */ diff --git a/packages/scripts/api.json b/packages/scripts/api.json index 1c7b74b7..15c867b2 100644 --- a/packages/scripts/api.json +++ b/packages/scripts/api.json @@ -49987,6 +49987,43 @@ "Boolean" ] }, + { + "id": 1733759742, + "platform_framework": [ + "2" + ], + "component": "Form", + "field_category": 1, + "field_name": "supportNumberKey", + "field_type": [ + "4" + ], + "field_default_value": "true", + "field_enum": "", + "field_desc_zh": "是否支持使用数字作为表单键值,在1.9.3版本后表单组件支持数字作为键值,若仍需要保留数字作为数组下标,请关闭此API", + "field_desc_en": "support using numbers as form key values or not. Form supports numbers as key values since 1.9.3, set supportNumberKey as false If you still need to retain numbers as array subscripts", + "field_required": 0, + "event_input": "", + "create_time": "2024-12-09 15:55:42", + "update_time": "2024-12-09 15:55:42", + "event_output": null, + "custom_field_type": null, + "syntactic_sugar": null, + "readonly": 1, + "html_attribute": 0, + "trigger_elements": "", + "deprecated": 0, + "version": "", + "test_description": null, + "support_default_value": 0, + "field_category_text": "Props", + "platform_framework_text": [ + "React(PC)" + ], + "field_type_text": [ + "Boolean" + ] + }, { "id": 177, "platform_framework": [