首页 文章

React-router-dom v4在页面加载时不呈现组件

提问于
浏览 次
1

所以基本上我有一个在路线之间切换的导航栏 . 页面加载时，默认情况下会转到/ home，但实际上并不会呈现给定的App组件 . 我必须单击将您带到/ home的按钮才能呈现此内容 .

我正在使用react-router-dom和Redux .

这是我的BrowserRouter：

<Provider store = {store}>
    <BrowserRouter>
      <div>
        <Header />
        <Route exact path = "/home" component={App}> </Route>
        <Switch>
          <Route  path = "/about" render = {() => <AboutUs />}></Route>
          <Route  path = "/contact" render = {() => <Contact />}></Route>
          <Route  path = "/services" render = {() => <Services />}></Route>
        </Switch>
      </div>
    </BrowserRouter>
  </Provider>

任何建议？

javascript reactjs redux react-router-v4 react-router-dom

2 回答

  • 0

    默认路由是 / 而不是 /home . 您需要设置重定向 .

    <Route exact path="/" render={() => ( <Route exact path="/home" component={App} /> )} />

    回复于
  • 0

    将 /home 路由放在 Switch 中，包含所有其他路由：

    <Provider store = {store}>
    <BrowserRouter>
      <div>
        <Header />
        <Switch>
          <Route exact path = "/home" component={App}> </Route>
          <Route  path = "/about" render = {() => <AboutUs />}></Route>
          <Route  path = "/contact" render = {() => <Contact />}></Route>
          <Route  path = "/services" render = {() => <Services />}></Route>
        </Switch>
      </div>
    </BrowserRouter>
  </Provider>
    回复于

相关问题