feat: Support requiredMarkType #26309

zombieJ · 2020-08-20T09:10:40Z

🤔 This is a ...

🔗 Related issue link

💡 Background and solution

📝 Changelog

Language	Changelog
🇺🇸 English	Form support style of required mark with `requiredMark`.
🇨🇳 Chinese	Form 添加 `requiredMark` 属性以支持设置必选样式。

☑️ Self Check before Merge

⚠️ Please check all items below before review. ⚠️

Doc is updated/provided or not needed
Demo is updated/provided or not needed
TypeScript definition is updated/provided or not needed
Changelog is provided or not needed

View rendered components/form/demo/required-mark.md
View rendered components/form/index.en-US.md
View rendered components/form/index.zh-CN.md

zombieJ · 2020-08-20T09:12:49Z

有点纠结这个 API 名字，更好的应该是 requiredType 但是现在有个 hideRequiredMark 属性不得不用这个名字。我有一个想法是直接 Deprecated 掉 hideRequiredMark。然后直接 requiredType = null 来实现同样的效果，这样也免得又两个相互作用的 API。

cc @ant-design/ant-design-collaborators

ant-design-bot · 2020-08-20T09:14:17Z

ant-design-bot · 2020-08-20T09:14:38Z

afc163 · 2020-08-20T09:14:50Z

components/locale/zh_CN.tsx

@@ -75,6 +75,7 @@ const localeValues: Locale = {
    back: '返回',
  },
  Form: {
+    optional: '（可选）',


最好 Form 级别也可配，有些地方用 选填。

这个是 locale，属性来自 Form 的 requiredMarkType，预览好了我贴一下链接方便理解。

我意思是每个 Form 对这个属性可以有控制权。

xrkffgg · 2020-08-20T09:22:51Z

我的想法：

必填显* requiredType="required"
必填不显 * requiredType="required" + hideRequiredMark={false}
选填不显* requiredType="optional"

requiredType 也可以改成一个 boolean 的，叫 ifRequired 类似

Item 继承 Form，可单独配置。

不过，这样好像把 required 从 rules 提出来了。。。。

07akioni · 2020-08-20T09:29:44Z

requiredType 字面上容易让人脑补出其他意思。

如果未来能传 ReactNode 建议直接用 requireMark。

requiredMarkType 建议，用户都写了那么多代码了，而且还有智能提示，还是看的明白比较重要。

github-actions · 2020-08-20T09:29:48Z

Size Change: +592 B (0%)

Total Size: 787 kB

Filename	Size	Change
`./dist/antd-with-locales.min.js`	311 kB	+244 B (0%)
`./dist/antd.compact.min.css`	65.2 kB	+41 B (0%)
`./dist/antd.dark.min.css`	66.5 kB	+47 B (0%)
`./dist/antd.min.css`	65.2 kB	+45 B (0%)
`./dist/antd.min.js`	279 kB	+215 B (0%)

_{compressed-size-action}

afc163 · 2020-08-20T09:32:26Z

- requireMarkType
+ requiredMarkType

codesandbox-ci · 2020-08-20T09:34:59Z

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit d764bb9:

Sandbox	Source
antd reproduction template	Configuration

codesandbox-ci · 2020-08-20T09:45:54Z

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit ab5bd14:

Sandbox	Source
antd reproduction template	Configuration

kerm1it · 2020-08-20T09:46:06Z

requiredMark， true 为显示，false 为隐藏，optional 为可选，后期如果想自定义可以扩展为 function

zombieJ · 2020-08-20T14:04:21Z

requiredMark 感觉可以的，hideRequiredMark 从文档里移除但是不 warning。

hengkx · 2020-08-20T16:28:53Z

文档移除还是废弃掉吧不然感觉有歧义

zombieJ · 2020-08-21T01:46:34Z

文档移除还是废弃掉吧不然感觉有歧义

隔几个版本再 warning，否则用户升级一脸懵逼怎么到处都是 warning 也不好。

codecov · 2020-08-21T02:53:02Z

Codecov Report

Merging #26309 into feature will increase coverage by 0.01%.
The diff coverage is 100.00%.

@@             Coverage Diff             @@
##           feature   #26309      +/-   ##
===========================================
+ Coverage    99.56%   99.57%   +0.01%     
===========================================
  Files          375      375              
  Lines         7316     7335      +19     
  Branches      1997     2005       +8     
===========================================
+ Hits          7284     7304      +20     
+ Misses          32       31       -1

Impacted Files	Coverage Δ
components/form/context.tsx	`100.00% <ø> (ø)`
components/locale-provider/index.tsx	`100.00% <ø> (ø)`
components/locale/default.tsx	`100.00% <ø> (ø)`
components/locale/zh_CN.tsx	`100.00% <ø> (ø)`
components/form/Form.tsx	`100.00% <100.00%> (ø)`
components/form/FormItem.tsx	`100.00% <100.00%> (+0.77%)`	⬆️
components/form/FormItemLabel.tsx	`100.00% <100.00%> (ø)`
components/locale-provider/LocaleReceiver.tsx	`100.00% <100.00%> (ø)`

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 55c1dd0...ab5bd14. Read the comment docs.

zombieJ · 2020-08-21T03:40:22Z

done

xrkffgg · 2020-08-21T03:48:28Z

components/form/style/index.less

+      // Optional mark
+      .@{form-item-prefix-cls}-optional {
+        display: inline-block;
+        margin-left: @margin-xss;


这个有对应的 RTL 吗？

我启动看一下

xrkffgg · 2020-08-21T04:00:35Z

我直接改了

kerm1it · 2020-08-21T04:03:36Z

记得 changeLog 更新一下。

07akioni · 2020-08-21T04:41:46Z

components/form/Form.tsx

@@ -65,17 +82,18 @@ const InternalForm: React.ForwardRefRenderFunction<unknown, FormProps> = (props,
  const { __INTERNAL__ } = wrapForm;
  __INTERNAL__.name = name;

-  const formContextValue = React.useMemo(
+  const formContextValue = useMemo<FormContextProps>(


这地方有必要 useMemo 吗？感觉不是很费性能。是内部还依赖这个值的引用？

之前有相关 issue 中间加了 memo 还是会被上层 context 变化触发渲染

之前有相关 issue 中间加了 memo 还是会被上层 context 变化触发渲染

没理解，加了还触发的意思不就是加不加都差不多嘛？是说不加才触发渲染吗

pr-triage bot added the PR: draft label Aug 20, 2020

afc163 reviewed Aug 20, 2020

View reviewed changes

zombieJ added 2 commits August 20, 2020 17:33

feat: support requreidMarkType

c8165c4

docs: Update doc desc

45e0276

zombieJ force-pushed the requiredMarkType branch from d764bb9 to 45e0276 Compare August 20, 2020 09:34

fix lint

98893b0

use requiredMark instead

da31a1b

zombieJ added 2 commits August 21, 2020 10:25

not change className

c004847

fix ts

7a22646

update test case

867846a

zombieJ marked this pull request as ready for review August 21, 2020 03:40

pr-triage bot added PR: unreviewed and removed PR: draft labels Aug 21, 2020

xrkffgg reviewed Aug 21, 2020

View reviewed changes

rtl style

fff67e3

fix rtl

ab5bd14

xrkffgg approved these changes Aug 21, 2020

View reviewed changes

pr-triage bot added PR: reviewed-approved and removed PR: unreviewed labels Aug 21, 2020

kerm1it approved these changes Aug 21, 2020

View reviewed changes

07akioni reviewed Aug 21, 2020

View reviewed changes

zombieJ merged commit 60771a0 into feature Aug 21, 2020

zombieJ deleted the requiredMarkType branch August 21, 2020 04:58

pr-triage bot added PR: merged and removed PR: reviewed-approved labels Aug 21, 2020

zombieJ mentioned this pull request Aug 22, 2020

docs: 4.6.0 changelog #26342

Merged

1 task

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: Support requiredMarkType #26309

feat: Support requiredMarkType #26309

zombieJ commented Aug 20, 2020 •

edited by kerm1it

Loading

zombieJ commented Aug 20, 2020 •

edited

Loading

ant-design-bot commented Aug 20, 2020 •

edited

Loading

ant-design-bot commented Aug 20, 2020 •

edited

Loading

afc163 Aug 20, 2020

zombieJ Aug 20, 2020 •

edited

Loading

afc163 Aug 20, 2020

xrkffgg commented Aug 20, 2020 •

edited

Loading

07akioni commented Aug 20, 2020 •

edited

Loading

github-actions bot commented Aug 20, 2020 •

edited

Loading

afc163 commented Aug 20, 2020

codesandbox-ci bot commented Aug 20, 2020

codesandbox-ci bot commented Aug 20, 2020 •

edited

Loading

kerm1it commented Aug 20, 2020

zombieJ commented Aug 20, 2020

hengkx commented Aug 20, 2020

zombieJ commented Aug 21, 2020

codecov bot commented Aug 21, 2020 •

edited

Loading

zombieJ commented Aug 21, 2020

xrkffgg Aug 21, 2020

zombieJ Aug 21, 2020

xrkffgg Aug 21, 2020

xrkffgg commented Aug 21, 2020

kerm1it commented Aug 21, 2020

07akioni Aug 21, 2020

zombieJ Aug 21, 2020

07akioni Aug 21, 2020

feat: Support requiredMarkType #26309

feat: Support requiredMarkType #26309

Conversation

zombieJ commented Aug 20, 2020 • edited by kerm1it Loading

🤔 This is a ...

🔗 Related issue link

💡 Background and solution

📝 Changelog

☑️ Self Check before Merge

zombieJ commented Aug 20, 2020 • edited Loading

ant-design-bot commented Aug 20, 2020 • edited Loading

ant-design-bot commented Aug 20, 2020 • edited Loading

Choose a reason for hiding this comment

zombieJ Aug 20, 2020 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

xrkffgg commented Aug 20, 2020 • edited Loading

我的想法：

07akioni commented Aug 20, 2020 • edited Loading

github-actions bot commented Aug 20, 2020 • edited Loading

afc163 commented Aug 20, 2020

codesandbox-ci bot commented Aug 20, 2020

codesandbox-ci bot commented Aug 20, 2020 • edited Loading

kerm1it commented Aug 20, 2020

zombieJ commented Aug 20, 2020

hengkx commented Aug 20, 2020

zombieJ commented Aug 21, 2020

codecov bot commented Aug 21, 2020 • edited Loading

Codecov Report

zombieJ commented Aug 21, 2020

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

xrkffgg commented Aug 21, 2020

kerm1it commented Aug 21, 2020

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

zombieJ commented Aug 20, 2020 •

edited by kerm1it

Loading

zombieJ commented Aug 20, 2020 •

edited

Loading

ant-design-bot commented Aug 20, 2020 •

edited

Loading

ant-design-bot commented Aug 20, 2020 •

edited

Loading

zombieJ Aug 20, 2020 •

edited

Loading

xrkffgg commented Aug 20, 2020 •

edited

Loading

07akioni commented Aug 20, 2020 •

edited

Loading

github-actions bot commented Aug 20, 2020 •

edited

Loading

codesandbox-ci bot commented Aug 20, 2020 •

edited

Loading

codecov bot commented Aug 21, 2020 •

edited

Loading