vue-router怎么重定向页面?
发布于 2021-01-11 17:02:36
关注者
0
被浏览
466
4 个回答
-
<div id="first"> <router-link to="/a">老八一号</router-link> <router-view></router-view> </div> <script> let a={ template:`<h1>奥里给 干了 兄弟们</h1>` }; let b={ template:`<h2>虽然不是同一个时间,但是是同一个撤所儿</h2>` }; let routeObj=new VueRouter({ routes:[ {path:'/a',redirect:'/b'}, {path:'/b',component:b} ] }); let vm=new Vue({ el:"#first", data:{}, router:routeObj }) </script>
redirect中写一个路径就可以
-
忘了说 还有一种是name的
<div id="first"> <router-link to="/xiangcunlove">乡村爱情</router-link> <router-link to="/horsebighandsome">马大帅</router-link> <router-view></router-view> </div> <script> let horse={ template:`<div>水库浪子--范德彪</div>` }; let horse2={ template:`<div>我谢广坤这辈子没说过谢字</div>` }; let routerObj=new VueRouter({ routes:[ {path:'/xiangcunlove', redirect:{name:'dashuai'}}, {path:'/horsebighandsome',component:horse}, {path:'/horsebighandsome2',component:horse2,name:'dashuai'}, ] }); let vm=new Vue({ el:'#first', router:routerObj }) </script>
-
方法一:在routes:[{
{ path: '/a', redirect: '/b' }
}]
方法二:别名
routes: [
{ path: '/a', component: A, alias: '/b' }
] -
以一个实例来说,最直观:
export default { path: '', name: '', meta: { //元信息(非必填) icon: '', //路由图标 title: '', //路由名称 light: '', //高亮显示那个路由name show: true, //是否显示 }, redirect: { name: '', //重定向,指向哪个路由的name }, component: '', //当前路由时要显示的组件 children: [], //嵌套子路由 }