reactjs - 使用 React Router 传递状态最简单的方法是什么？

Question

使用 React Router 传递状态最简单的方法是什么？我下面的 Navi 组件反射(reflect)用户为空，而不是用户为“KungLoad”。谢谢。

class App extends Component{
  constructor() {
    super();
    this.state = {user: "KungLoad"};
}
  render () {
    return(
    <div>
<Router> 
    <Route exact path="/" state  component = {Navi} />
  </Router>

Answer 1

最简单的方式就是将state作为props传递，然后在指定的组件中使用。对于您的情况，您必须使用 render 而不是 component 将状态作为 Prop 传递。

<Route exact path="/" render={() => <Navi user={this.state.user} />}  />

这会起作用，但我会向您推荐 reactJS 的 Context API 概念最适合这里。您可以使用数据提供者将状态或 Prop 传递给所有组件，所有组件都将使用父组件提供的状态或 Prop 。 . https://reactjs.org/docs/context.html