代码之家 › 专栏 › 技术社区 › ashfaq.p

嵌套路由在react中不工作[重复]

react-router reactjs

1

ashfaq.p · 技术社区 · 7 年前

这个问题已经有了答案:

React Router 4 Nested Routes not rendering 1答

我在app.js中有两条路线

<Switch>
    <MainRoute exact={true} path="/" component={Main} />
    <Route path="/login" component={Login} />
</Switch>

在主要组件中,我有:

<div><Link to="/reviews" /></div>
<div style={{ height: '1000px' }}>
  {/* Routes */}
  <Switch>
    <Route path="/reviews" component={Reviews} />
  </Switch>
</div>

登录和主路由正常工作,并显示链接。但点击链接后,页面变成空白。

附言:我是一个反应新手。

1 回复 | 直到 7 年前

1

Anurag Awasthi 7 年前

像这样改变路线,

<Switch>
    <Route path="/login" component={Login} />
    <MainRoute path="/" component={Main} />
</Switch>

首先它将匹配路径 /login 如果不匹配就会匹配 / . / 两者都匹配 / 和 /reviews . 你需要,

去除 exact=true 以便 / 也匹配 评论
更改的顺序 / 和 /登录 ,以便它首先尝试匹配 /登录 然后 /