组件安装后反应最终形式更改的初始值

时间:2019-03-19 18:51:59

标签: reactjs state react-final-form

EditPlayerModal.js容器中打开了一个player.js模态。从player.js准备了一个 initialValues ,并将其传递给EditPlayer.js

initialValues = {name: 'abc', country: 'France',......}看起来像这样。国家是一个反应性的最终形式下拉组件。

EditPlayerModal.js

render () {

.....
.....

const changePlayerCountry = ([name], state, methods) => {
  methods.changeValue(state, name, () => this.state.selectedPlayer);
};


<Form
    initialValues={this.props.initialValues}
    mutators={{ ...arrayMutators, changePlayerCountry }}
    onSubmit={onSubmit}
    validate={validate}
    render={({
      pristine,
      values,
      handleSubmit,
      form,
    }) => (
      <form onSubmit={handleSubmit}>
         ........
         ........
         ........
         ........

        <PlayerDetailModal
            show={this.state.show}
            closeModal={this.state.closeModal}        
            countryDropdownChangeHandler={(e) => {
                this.setState({
                    selectedPlayer: e
                      }, () => {
                        form.mutators.changePlayerCountry('country')
                      })
                    }}
                  />

PlayerDetailModal

countryDropdownChangeHandler = (e) => {
    this.props.countryDropdownChangeHandler(e)
}

将更改 PlayerDetailModal.js 国家/地区,并调用countryDropdownChangeHandler道具。

问题

  • 为什么 EditPlayerModal.js 国家/地区下拉菜单处理程序中的国家/地区未更改?
  • 我在做什么错了?

我尝试的另一种方法是将国家一直传递到父index.js,并更改 initialValues 国家对象。然后使用 shouldComponentUpdate 并检查 EditPlayerModal.js 中的prev和下一个initialValue并重新渲染组件。这种方法也不起作用。

在这里反应和反应最终形式的新手!

谢谢

0 个答案:

没有答案