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

Feature Request: Support dynamic condition render for FormItem #20412

Closed
1 task done
EscapeB opened this issue Dec 24, 2019 · 3 comments
Closed
1 task done

Feature Request: Support dynamic condition render for FormItem #20412

EscapeB opened this issue Dec 24, 2019 · 3 comments
Assignees
Labels

Comments

@EscapeB
Copy link
Contributor

EscapeB commented Dec 24, 2019

  • I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

Sample: https://codesandbox.io/s/antd-reproduction-template-eky0k
Click Change form data -> Click rerun setFieldsValue


Now, when we use dynamic rendering for FormItem like this:

{formValue.type === 1 && (
         <Form.Item> {getFieldDecorator ("input", {}) (<Input />)} </ Form.Item>
       )}

If you call setFieldsValue, there is a warning because the dynamic rendering field is not registered in the FieldsStore of rc-form: Warning: You cannot set a form field before rendering a field associated with the value.
You have to call setFieldsValue or setFieldsValue again to set the value of the dynamically rendered FormItem.


现在在动态渲染FormItem的时候,例如

{formValue.type === 1 && (
        <Form.Item>{getFieldDecorator("input", {})(<Input />)}</Form.Item>
      )}

如果调用setFieldsValue,由于动态渲染field没有注册到rc-form的FieldsStore中,所以会有一个警告:Warning: You cannot set a form field before rendering a field associated with the value.
必须再次调用setFieldsValue或setFieldsValue才能设置动态渲染出来的FormItem的值。

What does the proposed API look like?

Can you support adding a props to FormItem: condition (may not call this name)
API example

  <Form.Item condition = {formValue.type === 1}> {getFieldDecorator ("input", {}) (<Input />)} </ Form.Item>

Register all dynamic FormItem in FieldsStore.
Notice that there is a hidden option in getFieldProps of rc-form
Is it possible to hide the item via css and set hidden option?


能否支持在FormItem 中添加一个props: condition(可能不叫这个名字)
API例如

 <Form.Item condition={formValue.type === 1 }>{getFieldDecorator("input", {})(<Input />)}</Form.Item>

将所有动态的表单项都注册。
注意到rc-form的getFieldProps options参数中有hidden这一个选项。
是否能通过css和 rc-form getFieldProps options中的 hidden来隐藏和忽略该项?

@yoyo837
Copy link
Contributor

yoyo837 commented Dec 27, 2019

我认为应该用不到你说的这个功能。
清楚当前哪些表单项生效是理所应当的。

sometingTrue && <Form.Item />

@EscapeB
Copy link
Contributor Author

EscapeB commented Dec 30, 2019

清楚当前哪些表单项生效是理所应当的。

知道哪些表单生效是当然的。
核心问题是当存在动态渲染表单项时,目前的机制setFieldsValue需要重复触发来回填表单项,例子里有说。
希望可以支持一次setFieldsValue即可回填。

@zombieJ
Copy link
Member

zombieJ commented Jun 8, 2020

Close since it's no more a problem in v4.

@zombieJ zombieJ closed this as completed Jun 8, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

5 participants