javascript - 如何在reactjs中更新挂载状态

Question

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

在我的场景中，通过单击按钮添加新，它会定向到添加新页面，因为单击保存将重定向到显示页面，这是有效的。当我转到添加新页面时在显示多选中保持相同(始终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>
}

Answer 1

既然您提到重定向到下一页，您也可以尝试 this.props.history.push("/report") 这里“/report”是您要重定向到的链接。你可以查看React-Routing Concept(只是一个建议)

用于将 props 从父组件发送到子组件您的情况:

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