開發中有時候我們雖然設置的路徑不一致,但是我們希望跳轉到同一個頁面,或者說是打開同一個組件。這時候我們就用到了路由的重新定向redirect參數。
redirect基本重定向
我們只要在路由配置文件中(/src/router/index.js)把原來的component換成redirect參數就可以了。我們來看一個簡單的配置。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
export default new Router({
routes: [
{
path: '/',
component: Hello
},{
path:'/params/:newsId(\\d+)/:newsTitle',
component:Params
},{
path:'/goback',
redirect:'/'
}
]
})
|
這里我們設置了goback路由,但是它並沒有配置任何component(組件),而是直接redirect到path:’/’下了,這就是一個簡單的重新定向。
重定向時傳遞參數
我們已經學會了通過url來傳遞參數,那我們重定向時如果也需要傳遞參數怎么辦?其實vue也已經為我們設置好了,我們只需要在ridirect后邊的參數里復制重定向路徑的path參數就可以了。可能你看的有點暈,我們來看一段代碼:
|
1
2
3
4
5
6
7
|
{
path:'/params/:newsId(\\d+)/:newsTitle',
component:Params
},{
path:'/goParams/:newsId(\\d+)/:newsTitle',
redirect:'/params/:newsId(\\d+)/:newsTitle'
}
|
已經有了一個params路由配置,我們在設置一個goParams的路由重定向,並傳遞了參數。這時候我們的路由參數就可以傳遞給params.vue組件了。參數接收方法和正常的路由接收方法一樣。
