react版本:18.2.0
react-router-dom版本:6.16.0
问题描述:
后台管理系统中,配置好路由之后,点击菜单栏跳转路由,跳转之后会将不显示菜单栏以及头部底部区域
解决方式
警告意思是父路由路径没有尾随“ *”。这意味着如果您导航得更深,则父路由器将不再匹配,因此子路由器将永远不会呈现。
只需要在最外侧使用路由的地方加上如下:
<Routes>
<Route path='/admin/*' element={<Admin/>} />
<Route path='/login' element={<Login/>} />
<Route path='/*' element={<Admin/>} />
</Routes>
另外
函数式组件在配置路由时,是通过
import route from ‘../routes’
const element=useRoutes(route)
然后在需要展示路由的地方写上
<div>{element}</div>