解决在Router6中使用路由表中对嵌套路由进行重定向的问题
解决在Router6中使用路由表中对嵌套路由进行重定向的问题
自己在试了很多的方法后,只有这一种方法实现了效果
我想实现的效果是:在登录后,进入到home组件下默认展示home的子路由组件mainshow
我在写下面代码的时候是这样想的:先让它匹配到/home
展示Home组件,然后在匹配一次进行重定向到子级路由,展示子级路由,发现不行,原因是因为在路由表匹配到第一个后就不会向下匹配
后面我将其调换了一下顺序就可以了,当匹配/home
将其重定向到/home/mianshow
,然后它就会先去渲染Home组件,再渲染MainShow组件
export const router:Array<RouterType> = [
{
path:'/login',
element:(
<Suspense>
<Login/>
</Suspense>
)
},
{
path:'/home',
element:<Navigate to='/home/mainshow'/>
},
{
path:'/home',
element:<Home/>,
children:[
{
path:'mainshow',
element:(
<Suspense>
<MainShow/>
</Suspense>
)
}
]
},
{
path:'*',
element:(
<Suspense>
<Navigate to={localStorage.getItem('token')?'/home':'/login'} />
</Suspense>
)
},
]
总结
以上就是今天要讲的内容,希望对大家有所帮助!!!