react-component / react-component/field-form

validator校验无法输出'${example}'

Open
#584 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
1k
Forks
286
Avg merge
4d 16h
Merged PRs (30d)
1

Description

问题:在使用antd的Form.Item组件遇到,输入校验错误会输出undefined,问题代码如下:
<Form.Item
name={'demo'}
label={'demo'}
rules={[
{
validator: (rule, value) => {
if (!value) {
return Promise.reject('${example}');
}
return Promise.resolve();
},
},
]}

问题原因:查阅了代码发现validateUtil.ts这个文件的replaceMessage函数对'${}'字符串做了特殊处理,但是TS校验没有暴露出来这个处理。

解决:修改代码为如下,可以解决问题
<Form.Item
name={'demo'}
label={'demo'}
rules={[
{
validator: (rule, value) => {
if (!value) {
return Promise.reject('${example}');
}
return Promise.resolve();
},
example: '${example}',
},
]}

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reading validateUtil.ts, especially replaceMessage, and trace how validator rejection messages are processed and typed. Confirm the intended handling of '${example}' without relying on the workaround rule property, then verify the validator message behavior with the repository's existing validation checks.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.