Javascript 如何在reactjs中更新装载状态

如何在装载后更新状态，或者如何在react中从一个页面移动到另一个页面时传递状态

在我的场景中，通过单击按钮

AddNew

，它将指向AddNew页面，在这种情况下，单击

save

将重定向到display页面，这是有效的。 当我移动到addnew页面时 在“显示多选保持不变”（始终为en）中，如何在重定向后获得渲染状态

class Display extends React.PureComponent{
  constructor(props) {
    super(props);
}
componentWillMount() {
    console.log(this.state.language);
    const defLanguage = this.props.loginData.language; // "en"
    this.setState({ language: defLanguage.split(",") }, () =>
      this.callQueryApiForFetch("ONLOAD")
    );
  }
render(){
               <MultiSelect
                      filterOptions={formatLanguageArray(
                        languageConfig.pvalues
                      )}
                      setSelectedFieldValues={value => {
                        this.setState({ language: value }, () => {
                          this.callQueryApiForFetch("ONLOAD");
                        });
                      }}
                      id="language"
                      itemsSelected={this.state.language}
                      label="Select Language"
                    />

         <button className="page-header-btn icon_btn display-inline">
            <img
              title="edit"
              className="tableImage"
              src={`${process.env.PUBLIC_URL}/assets/icons/ic_addstore.svg`}
            />
            {`Add New`}
          </button>

}

}


class AddNew extends React.Component {

  constructor(props) {
    super(props);

  }
componentWillReceiveProps = () => {
     const defLanguage = this.props.location.state.language;
      this.setState({ language: defLanguage }); 
}
 render(){

           <Link
          to={{
            pathname: "/ui/product-info",
            state: {
              language: this.state.language
            }
          }}
          className="btn btn-themes btn-rounded btn-sec link-sec-btn"
        >
          Save
        </Link>
}

类显示扩展了React.PureComponent{
建造师（道具）{
超级（道具）；
}
组件willmount（）{
console.log（this.state.language）；
const defLanguage=this.props.loginda.language；/“en”
this.setState（{language:deflaguage.split（“，”）}，（）=>
这个.callQueryApiForFetch（“ONLOAD”）
);
}
render（）{
{
this.setState（{language:value}，（）=>{
这个.callQueryApiForFetch（“ONLOAD”）；
});
}}
id=“语言”
itemsSelected={this.state.language}
label=“选择语言”
/>
{`addnew`}
}
}
类AddNew扩展了React.Component{
建造师（道具）{
超级（道具）；
}
组件将接收道具=（）=>{
const deflaguage=this.props.location.state.language；
this.setState（{language:deflaguage}）；
}
render（）{
拯救
}

将状态管理与组件呈现逻辑分离是一种很好的做法。其思想是将集中状态的片段从上到下传递到组件层次结构，并允许它们在其

呈现方法中使用这些数据。在这种方法中，避免将应用程序状态保留在组件中内特

每当组件需要更改应用程序状态时，它都会发送一条消息，该消息由一个名为“reducer”的函数处理，并更新存储中的状态。整个概念的基础是为整个应用程序提供单一的真实来源，并防止组件直接操纵存储

实现这一点的标准方法是使用名为Redux的设计模式，该模式可通过
React Redux
库用于React应用程序

我建议您看看教程，了解如何在实践中使用React-Redux库。
既然您提到要重定向到下一页，您也可以尝试
此.props.history.push（“/report”）
此处/report”是您要重定向到的链接。
您可以检查React路由概念（只是一个建议）

用于将道具从父组件发送到子组件
你的情况：

  componentWillReceiveProps(nextProps){
      if(nextProps.someValue!==this.props.someValue){
        //Perform some operation
        this.setState({someState: someValue });
        this.classMethod();
      }
    }

1.显示为组件，而不是纯组件

2.在显示中定义本地状态

// default state..
state = {
 language: 'us',
}

3.控制台是否在显示器的道具中使用您的语言（将安装）

//可能在里面

this.props.location.state

4.然后设置状态

this.setState(prevState => ({
 ...prevState,
 language: --value--,
})

在这种情况下，也许Redux有点过头了。您可以使用useReducer/useContext方法，或者正如其他人所说的，只需将一个道具从家长传递给孩子。