Reactjs React：如何使用React路由器在视图之间共享状态？

我使用react路由器路由到两个相互独立的视图。目前，我在

Home

和

Backend

中使用了一个新的state对象，但我想去掉它，因为两者都包含嵌套组件

class App extends Component {
  render() {
    return (
        <Router>
          <div className="App">
            <Route exact={true} path="/" component={Home} />

            <Route path="/app/:user_id" component={Backend} />
          </div>
        </Router>
    );
  }
}

类应用程序扩展组件{
render（）{
返回(
);
}
}

---

如何在不使用redux或flux等其他框架的情况下在视图之间共享状态？

将状态提升到“应用程序”组件中，然后通过其道具传递每个组件所需的状态元素

例如，应用程序中的状态可能如下所示：

App.state = {
  homeRelatedStuff: {...},
  backendRelatedStuff: {...},
  sharedStuff: {...}
}

然后，在声明要使用的组件时，您会传递一些道具：

<Route path={"/"} component={() => <Home homeStuff={this.state.homeRelatedStuff} sharedStuff={this.state.sharedStuff}/>}/>

}/>

*请注意，将组件作为函数列出的方法稍有不同，这样您就可以传递道具了

你所在的州不必像我一样将它们分开，这可能会更平坦，你可以将多个道具传递给每个组件