gpt4 book ai didi

javascript - React Router 无法渲染路由

转载 作者:行者123 更新时间:2023-12-01 03:18:09 24 4
gpt4 key购买 nike

react 和 react 路由器的新功能。我正在使用react-router-4

我有以下组件- 登录- 家 - 标题 - 侧边栏 - 内容

登录组件没有标题或侧边栏。

这就是我的路由方式

App.js

<Switch>
<Route exact path='/login' component={Login}/>
<Route exact path='/home' component={Home}/>
</Switch>

然后在我的主页组件中,我有侧边栏和内容。

Home.js渲染方法

<Grid>
<Grid.Row>
<Grid.Column width={3}>
<SideBar/>
</Grid.Column>
<Grid.Column width={13}>
<Route exact path='/home/dashboard' render={() => <div>Home</div>} />
</Grid.Column>
</Grid.Row>
</Grid>

侧栏组件有一个链接,其“to”值为“/home/dashboard”。

不幸的是,这不起作用。单击侧栏链接后,将加载一个空白页面。

根据我的理解,在React Router 4中,您可以在路由器层次结构中的任何位置渲染路由。这就是我试图通过在 'Grid.Column width={13}' div 中渲染路线来实现的目标。

我在这里缺少什么?

最佳答案

交换机中的第二条路由是问题所在。应该是:

<Switch>
<Route exact path='/login' component={Login} />
<Route component={Home} />
</Switch>

关于javascript - React Router 无法渲染路由,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45402117/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com