Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(form): formErrorMessage add whitespace #3284

Merged
merged 1 commit into from
Aug 28, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions src/form/form.en-US.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
:: BASE_DOC ::

## API

### Form Props

name | type | default | description | required
Expand Down Expand Up @@ -44,6 +45,7 @@ submit | `(params?: { showErrorMessage?: boolean })` | \- | required
validate | `(params?: FormValidateParams)` | `Promise<FormValidateResult<FormData>>` | required。[see more ts definition](https://github.com/Tencent/tdesign-vue/tree/develop/src/form/type.ts)。<br/>`interface FormValidateParams { fields?: Array<string>; showErrorMessage?: boolean; trigger?: ValidateTriggerType }`<br/><br/>`type ValidateTriggerType = 'blur' \| 'change' \| 'submit' \| 'all'`<br/>
validateOnly | `(params?: Pick<FormValidateParams, 'fields' \| 'trigger'>)` | `Promise<FormValidateResult<FormData>>` | required


### FormItem Props

name | type | default | description | required
Expand Down Expand Up @@ -102,3 +104,4 @@ required | String | - | \- | N
telnumber | String | - | \- | N
url | String | - | \- | N
validator | String | - | \- | N
whitespace | String | - | \- | N
11 changes: 7 additions & 4 deletions src/form/form.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,10 @@
<!-- 可在这里自行添加 demo 展示 -->

## API

### Form Props

名称 | 类型 | 默认值 | 说明 | 必传
名称 | 类型 | 默认值 | 描述 | 必传
-- | -- | -- | -- | --
colon | Boolean | false | 是否在表单标签字段右侧显示冒号 | N
data | Object | {} | 表单数据。TS 类型:`FormData` | N
Expand Down Expand Up @@ -46,9 +47,10 @@ submit | `(params?: { showErrorMessage?: boolean })` | \- | 必需。提交表
validate | `(params?: FormValidateParams)` | `Promise<FormValidateResult<FormData>>` | 必需。校验函数,包含错误文本提示等功能。泛型 `FormData` 表示表单数据 TS 类型。<br/>【关于参数】`params.fields` 表示校验字段,如果设置了 `fields`,本次校验将仅对这些字段进行校验。`params.trigger` 表示本次触发校验的范围,'params.trigger = blur' 表示只触发校验规则设定为 trigger='blur' 的字段,'params.trigger = change' 表示只触发校验规则设定为 trigger='change' 的字段,默认触发全范围校验。`params.showErrorMessage` 表示校验结束后是否显示错误文本提示,默认显示。<br />【关于返回值】返回值为 true 表示校验通过;如果校验不通过,返回值为校验结果列表。[详细类型定义](https://github.com/Tencent/tdesign-vue/tree/develop/src/form/type.ts)。<br/>`interface FormValidateParams { fields?: Array<string>; showErrorMessage?: boolean; trigger?: ValidateTriggerType }`<br/><br/>`type ValidateTriggerType = 'blur' \| 'change' \| 'submit' \| 'all'`<br/>
validateOnly | `(params?: Pick<FormValidateParams, 'fields' \| 'trigger'>)` | `Promise<FormValidateResult<FormData>>` | 必需。纯净的校验函数,仅返回校验结果,不对组件进行任何操作。泛型 `FormData` 表示表单数据 TS 类型。参数和返回值含义同 `validate` 方法


### FormItem Props

名称 | 类型 | 默认值 | 说明 | 必传
名称 | 类型 | 默认值 | 描述 | 必传
-- | -- | -- | -- | --
for | String | - | label 原生属性 | N
help | String / Slot / Function | - | 表单项说明内容。TS 类型:`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
Expand All @@ -66,7 +68,7 @@ tips | String / Slot / Function | - | 自定义提示内容,样式跟随 `stat

### FormRule

名称 | 类型 | 默认值 | 说明 | 必传
名称 | 类型 | 默认值 | 描述 | 必传
-- | -- | -- | -- | --
boolean | Boolean | - | 内置校验方法,校验值类型是否为布尔类型,示例:`{ boolean: true, message: '数据类型必须是布尔类型' }` | N
date | Boolean / Object | - | 内置校验方法,校验值是否为日期格式,[参数文档](https://github.com/validatorjs/validator.js),示例:`{ date: { delimiters: '-' }, message: '日期分隔线必须是短横线(-)' }`。TS 类型:`boolean \| IsDateOptions` `interface IsDateOptions { format: string; strictMode: boolean; delimiters: string[] }`。[详细类型定义](https://github.com/Tencent/tdesign-vue/tree/develop/src/form/type.ts) | N
Expand All @@ -89,7 +91,7 @@ whitespace | Boolean | - | 内置校验方法,校验值是否为空格。示

### FormErrorMessage

名称 | 类型 | 默认值 | 说明 | 必传
名称 | 类型 | 默认值 | 描述 | 必传
-- | -- | -- | -- | --
boolean | String | - | 布尔类型校验不通过时的表单项显示文案,全局配置默认是:`'${name}数据类型必须是布尔类型'` | N
date | String | - | 日期校验规则不通过时的表单项显示文案,全局配置默认是:`'请输入正确的${name}'` | N
Expand All @@ -104,3 +106,4 @@ required | String | - | 没有填写必填项时的表单项显示文案,全
telnumber | String | - | 手机号号码校验不通过时的表单项显示文案,全局配置默认是:`'请输入正确的${name}'` | N
url | String | - | 链接校验规则不通过时的表单项显示文案,全局配置默认是:`'请输入正确的${name}'` | N
validator | String | - | 自定义校验规则校验不通过时的表单项显示文案,全局配置默认是:'${name}不符合要求' | N
whitespace | String | - | 值为空格校验不通过时表单项显示文案,全局配置默认是:`'${name}不能为空` | N
5 changes: 5 additions & 0 deletions src/form/type.ts
Original file line number Diff line number Diff line change
Expand Up @@ -328,6 +328,11 @@ export interface FormErrorMessage {
* @default ''
*/
validator?: string;
/**
* 值为空格校验不通过时表单项显示文案,全局配置默认是:`'${name}不能为空`
* @default ''
*/
whitespace?: string;
}

export type FormRules<T extends Data = any> = { [field in keyof T]?: Array<FormRule> };
Expand Down
Loading