此代码的React-Router-Dom-v4版本？

Question

我有这个代码，我一直在尝试将其转换为react-router-v4。其想法是始终呈现App组件，然后我当前处于活动状态的任何选项卡都将更改(呈现)呈现的App中的视图。我在转换时遇到了一点麻烦，真的很感谢你的帮助。

这之前在react路由器v3上有效。我有一个想法，应该将IndexRoute更改为路由，因为我几乎可以肯定它已经折旧为准确的路由路径，但至于嵌套的路由，我不知道，这是我最近的尝试……然后是用于工作的React-router-v3版本。

  <BrowserRouter>
      <Route path="/home" component={HomePage} />
      <Route path="dashboard" exact component={AsyncDashboard} />
      <Route path="input" exact component={AsyncInput} />
      <Route path="calendar" exact component={AsyncCalendar} />
      <Route path="dropdown" exact component={AsyncDropdowns} />
      <Route path="range-picker" exact component={AsyncRangePicker} />
      <Route path="chart" exact component={AsyncChart} />
      <Route path="layout" exact component={AsyncLayout} />
  </BrowserRouter>

<Router history={browserHistory}>
    <Route path="/" component={App}>
      <IndexRoute exact component={AsyncDashboard} />
      <Route path="dashboard" exact component={AsyncDashboard} />
      <Route path="input" exact component={AsyncInput} />
      <Route path="calendar" exact component={AsyncCalendar} />
      <Route path="dropdown" exact component={AsyncDropdowns} />
      <Route path="range-picker" exact component={AsyncRangePicker} />
      <Route path="chart" exact component={AsyncChart} />
      <Route path="layout" exact component={AsyncLayout} />
    </Route>
  </Router>

Answer 1

• 不是将App包装在Route中，而是直接使用
• 使用路径为Route而不是/的use

<BrowserRouter>
  <App>
    <Route path='/' exact component={AsyncDashboard} />
    <Route path="/dashboard" exact component={AsyncDashboard} />
    <Route path="/input" exact component={AsyncInput} />
    <Route path="/calendar" exact component={AsyncCalendar} />
    <Route path="/dropdown" exact component={AsyncDropdowns} />
    <Route path="/range-picker" exact component={AsyncRangePicker} />
    <Route path="/chart" exact component={AsyncChart} />
    <Route path="/layout" exact component={AsyncLayout} />
  </App>
</BrowserRouter>