首页 文章

ReactJS在特定路由上导航（路由器v4）

提问于
浏览 次
0

所以我对ReactJS有点新意我希望用我的代码实现以下功能 -

const App = () => (
  <div>
    <Header />
    <Route path="/:page" exact component={PageWrapper} />
    <Route path="/" exact>
      <Redirect to="/home" />
    </Route>
  </div>
);

所以我想实现这一点，如果用户输入/ home，/ about，/ anythingElse作为它不导航的链接，但如果用户加载页面而不传递页面参数，例如 - localhost：3000 /或localhost：3000，那么它会自动将用户导航到localhost：3000 / home .

目前，如果用户进入页面，它也会导航到家中 . 我认为确切意味着确切的路线必须匹配才能加载 .

可能吗？

javascript reactjs

1 回答

  • 0

    您不应该在V4中嵌套路由 .

    您可以使用路由器中的 Switch 组件来确保只匹配一条路由 .

    这样，与 /:page 路由不匹配的所有路由都将重定向：

    const App = () => (
  <div>
    <Header />
    <Switch>
      <Route path="/:page" exact component={PageWrapper} />
      <Redirect to="/home" />
    </Switch>
  </div>
)

    请记住导入 Switch 组件 .

    回复于

相关问题