在 Route 中通过 props 传递数据

Question

我是 React.js 的新手，最近了解了 npm 包 react-router-dom (5.0.0)。我想通过 Route 中的 props 将我的数据传递到 Dashboard 组件中。像这样（显示错误）：

<BrowserRouter>
    <NavBar/>
    <Switch>
    <Route exact path="/" component={Dashboard} >
        <Dashboard Project={Something}/>
    </Route>
    <Route path="/createproject" component={CreateProject} />
    </Switch>
</BrowserRouter>

然后访问它：

class Dashboard extends Component {
  render() {
    return <h1>{this.props.Project}</h1>
  }
}

如果有人能帮助我，我将不胜感激。

Answer 1

Route render 道具允许您在 Route 中渲染组件并将道具传递给它。

<Route exact path="/" render={() => <Dashboard project={myProject}} />

查看 React Router official documentation。

在 Route 中通过 props 传递数据

Passing data through props in Route

reactjs

react-router-dom