feat: New Form #17327

zombieJ · 2019-06-26T17:01:43Z

🤔 This is a ...

👻 What's the background?

https://github.com/react-component/field-form/

📝 Changelog

Language	Changelog
🇺🇸 English	New Form!
🇨🇳 Chinese	新的 Form！

☑️ Self Check before Merge

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

TODO

Demo test support tsx test
Other Component Demo use Form update
Test Coverage

Preview

https://deploy-preview-17327--ant-design.netlify.com/components/form-cn/#header

todo · 2019-06-26T17:01:46Z

Remove this

ant-design/components/form-legacy/index.tsx

Lines 1 to 4 in 067abdb

    
           // TODO: Remove this 
        
           import Form from './Form'; 
        
           export {

This comment was generated by todo based on a `TODO` comment in `067abdb` in #17327. cc @ant-design.

tests-checker

Could you please add tests to make sure this change works as expected?

todo · 2019-06-26T17:01:49Z

handle this

ant-design/components/form/FormItem.tsx

Lines 141 to 146 in 067abdb

    
           [`${prefixCls}-item-with-help`]: domErrorVisible, // TODO: handle this 
        
           [`${className}`]: !!className, 
        
           // Status 
        
           [`${prefixCls}-item-has-feedback`]: 
        
             (mergedValidateStatus && hasFeedback) || mergedValidateStatus === 'validating',

This comment was generated by todo based on a `TODO` comment in `067abdb` in #17327. cc @ant-design.

zombieJ · 2019-07-02T08:26:29Z

doc: https://github.com/ant-design/ant-design/blob/form/components/form/index.zh-CN.md

lgtm-com · 2019-07-02T08:39:57Z

This pull request fixes 1 alert when merging 013281c into f589577 - view on LGTM.com

fixed alerts:

1 for Unused variable, import, function or class

lgtm-com · 2019-07-02T09:28:55Z

This pull request fixes 1 alert when merging 0ac86bd into f589577 - view on LGTM.com

fixed alerts:

1 for Unused variable, import, function or class

lgtm-com · 2019-07-02T10:05:24Z

This pull request fixes 1 alert when merging 7705292 into f589577 - view on LGTM.com

fixed alerts:

1 for Unused variable, import, function or class

afc163 · 2019-07-03T05:44:35Z

好像缺 onError。

lgtm-com · 2019-07-03T09:48:00Z

This pull request fixes 1 alert when merging 52d8d48 into f589577 - view on LGTM.com

fixed alerts:

1 for Unused variable, import, function or class

lgtm-com · 2019-07-03T11:43:04Z

This pull request fixes 1 alert when merging 80a3ee8 into f589577 - view on LGTM.com

fixed alerts:

1 for Unused variable, import, function or class

afc163 · 2019-07-15T08:09:08Z

components/form/index.zh-CN.md

+| hasFeedback | 配合 `validateStatus` 属性使用，展示校验状态图标，建议只配合 Input 组件使用 | boolean | false |
+| help | 提示信息，如不设置，则会根据校验规则自动生成 | string\|ReactNode | - |
+| htmlFor | 设置子元素 label `htmlFor` 属性 | string | - |
+| inline | 为 `true` 时不带样式，作为纯字段控件使用 | boolean | false |


这个容易和样式里的 inline 概念混淆，有没有别的名字。

nostyle 如何

noStyle 和现在的 naming standard 不太合，要不然直接 style={false}？

style={false} 和其他组件行为不一致，不好。

那还是 inline 吧

inline 表意不明，建议还是 noStyle 或者 withoutStyle

marceloadsj · 2019-08-25T10:56:39Z

components/form/style/index.less

+    > label {
+      position: relative;
+      display: inline-block;
+      margin-top: @form-label-margin-top;


That line created a misalignment when we use label and input with diff sizes, for ex:

<Input size="large"/>

Label position is a fixed value instead of related vertical center of the Item since some component like TextArea (or Transfer or Tree or some else) occupy the more height of it.

For the size diff component, maybe provides some other prop to handle (still in thinking).

ref: https://codesandbox.io/s/hungry-driscoll-zc9cd

shaodahong · 2020-01-11T10:50:46Z

components/form-legacy/style/index.less

-  }
-}
-
-.make-vertical-layout() {


gavinxgu · 2020-02-09T05:41:19Z

When will this feature be released ？

yoyo837 · 2020-02-09T05:49:12Z

You can try it by the latest RC version.

alextrastero · 2020-04-29T08:09:23Z

components/form/FormList.tsx

+interface FieldData {
+  name: number;
+  key: number;
+  fieldKey: number;
+}


Are these types correct?

zombieJ added 18 commits June 26, 2019 14:38

init form

20fc91a

first demo

52ff337

add normal login

bfb2564

add style

a1cf3f0

webit

0bf44fd

support nest errors

e58b4c2

beauti form errors

c3d5a33

use onReset

5d3729c

modal demo

105a522

add list demo

dff365b

match key of errors logic

d9eb114

date demo

c789f86

customize component

661c124

moving style

0a73937

add status style

f58c4c9

without form create

c6aa29b

add demos

a011f35

add inline style

067abdb

pr-triage bot added the PR: draft label Jun 26, 2019

tests-checker bot suggested changes Jun 26, 2019

View reviewed changes

pr-triage bot added PR: reviewed-changes-requested and removed PR: draft labels Jun 26, 2019

This comment has been minimized.

Sign in to view

clean up legacy

92952d6

pr-triage bot added PR: draft and removed PR: reviewed-changes-requested labels Jun 26, 2019

zombieJ assigned afc163 Jun 26, 2019

fix typo

013281c

en doc

0ac86bd

zombieJ mentioned this pull request Jul 2, 2019

这个项目生产可用么？ react-component/field-form#22

Closed

Form.List doc

7705292

m v3 -> v4

52d8d48

add skip

80a3ee8

zombieJ merged commit 4cdf37b into 4.0-prepare Jul 3, 2019

pr-triage bot added PR: merged and removed PR: unreviewed labels Jul 3, 2019

delete-merged-branch bot deleted the form branch July 3, 2019 12:14

afc163 reviewed Jul 15, 2019

View reviewed changes

pr-triage bot added PR: unreviewed and removed PR: merged labels Jul 15, 2019

zombieJ mentioned this pull request Jul 19, 2019

feat: rename FormItem inline to noStyle #17729

Merged

10 tasks

afc163 mentioned this pull request Aug 15, 2019

Form.create new API discussion: Render Props or React Hooks #10640

Closed

1 task

marceloadsj reviewed Aug 25, 2019

View reviewed changes

shaodahong reviewed Jan 11, 2020

View reviewed changes

components/form-legacy/style/index.less

}

}

.make-vertical-layout() {

Copy link

Member

shaodahong Jan 11, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

##20836

shaodahong mentioned this pull request Jan 11, 2020

fix(Form.Item): label text align not correct when media less than xs and span not 24 #20836

Merged

14 tasks

alextrastero reviewed Apr 29, 2020

View reviewed changes

yoyo837 mentioned this pull request May 19, 2023

ConfigProvider组件会错误地导入整个'rc-field-form'，导致包体积剧增 #42499

Closed

zombieJ mentioned this pull request Aug 22, 2023

fix: rm useless form inline style #44360

Merged

20 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: New Form #17327

feat: New Form #17327

zombieJ commented Jun 26, 2019 •

edited by afc163

Loading

todo bot commented Jun 26, 2019

tests-checker bot left a comment

todo bot commented Jun 26, 2019

This comment has been minimized.

This comment has been minimized.

zombieJ commented Jul 2, 2019

lgtm-com bot commented Jul 2, 2019

lgtm-com bot commented Jul 2, 2019

lgtm-com bot commented Jul 2, 2019

afc163 commented Jul 3, 2019

lgtm-com bot commented Jul 3, 2019

lgtm-com bot commented Jul 3, 2019

afc163 Jul 15, 2019

zombieJ Jul 15, 2019

afc163 Jul 15, 2019

zombieJ Jul 15, 2019

afc163 Jul 15, 2019

zombieJ Jul 16, 2019

afc163 Jul 16, 2019

marceloadsj Aug 25, 2019

zombieJ Aug 25, 2019

shaodahong Jan 11, 2020

gavinxgu commented Feb 9, 2020

yoyo837 commented Feb 9, 2020 •

edited

Loading

alextrastero Apr 29, 2020

feat: New Form #17327

feat: New Form #17327

Conversation

zombieJ commented Jun 26, 2019 • edited by afc163 Loading

🤔 This is a ...

👻 What's the background?

📝 Changelog

☑️ Self Check before Merge

TODO

Preview

todo bot commented Jun 26, 2019

Remove this

This comment was generated by todo based on a TODO comment in 067abdb in #17327. cc @ant-design.

tests-checker bot left a comment

Choose a reason for hiding this comment

todo bot commented Jun 26, 2019

handle this

This comment was generated by todo based on a TODO comment in 067abdb in #17327. cc @ant-design.

This comment has been minimized.

This comment has been minimized.

zombieJ commented Jul 2, 2019

lgtm-com bot commented Jul 2, 2019

lgtm-com bot commented Jul 2, 2019

lgtm-com bot commented Jul 2, 2019

afc163 commented Jul 3, 2019

lgtm-com bot commented Jul 3, 2019

lgtm-com bot commented Jul 3, 2019

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

gavinxgu commented Feb 9, 2020

yoyo837 commented Feb 9, 2020 • edited Loading

Choose a reason for hiding this comment

zombieJ commented Jun 26, 2019 •

edited by afc163

Loading

This comment was generated by todo based on a `TODO` comment in `067abdb` in #17327. cc @ant-design.

This comment was generated by todo based on a `TODO` comment in `067abdb` in #17327. cc @ant-design.

yoyo837 commented Feb 9, 2020 •

edited

Loading