The value of antd initialValue is changed without re-rendering and emptying the entered form data

topic description

when I was working on the project, I found that the value of antd initialValue changed the input form data and did not change with it
when I did this, changing the value of searchFormData.loginName to the original input form data of initialValue: searchFormData.loginName, would not empty the update
strangely enough, when I wrote the initialValue: Math.random (), data in this way, it would update

.

now I have another need to refresh the page, but it doesn"t use routing.
Refresh the page is a global button. I empty all the state here to implement the refresh operation

.

but even if the state is empty, the contents of the entered form will not be emptied and the contents of the p tag have been emptied

sources of topics and their own ideas

my refresh operation operates on the top-level component, so there is no way to call the descendant-level this.props.form.resetFields (); method to clear

related codes

/ / Please paste the code text below (do not replace the code with pictures)

{searchFormData.loginName}

<FormItem label="" {...formItemLayout}> {getFieldDecorator("loginName", { initialValue: searchFormData.loginName, })( <Input defaultValue={searchFormData.loginName} /> )} </FormItem>

what result do you expect? What is the error message actually seen?

I hope that when I empty the state, the original input in the input will also be cleared, but I don"t want to use each input to write the onchang event, because there are more

Sep.07,2021

the data of the form can be stored in upper-level components or in Redux or dva by using onFieldsChange and mapPropsToFields,. For more information, please refer to the rc-form example.

Note: the form field data returned in mapPropsToFields must be wrapped in Form.createFormField.

Form.create({
  onFieldsChange(props, changedFields) {
    props.onChange(changedFields);
  },
  mapPropsToFields(props) {
    return {
      username: Form.createFormField({
        ...props.username,
        value: props.username.value,
      }),
    };
  },
  onValuesChange(_, values) {
    console.log(values);
  },
})

call

if you want to get real-time data.
this.props.form.getFieldValue("loginName")

after all, this is not a two-way binding

Menu