Skip to content

[vue] vue-router怎么重定向页面? #419

Open
@haizhilin2013

Description

@haizhilin2013
Collaborator

[vue] vue-router怎么重定向页面?

Activity

wenyejie

wenyejie commented on Jun 27, 2019

@wenyejie

路由中配置redirect属性

zhengao261

zhengao261 commented on Aug 6, 2019

@zhengao261

也可以使用路由的别名来完成重定向

liuxiaoyang1

liuxiaoyang1 commented on Nov 19, 2019

@liuxiaoyang1

方法一:在routes:[{
{ path: '/a', redirect: '/b' }
}]
方法二:别名
routes: [
{ path: '/a', component: A, alias: '/b' }
]

zlqGitHub

zlqGitHub commented on Dec 20, 2019

@zlqGitHub

以一个实例来说,最直观:

export default {
   path: '',
   name: '',
   meta: {  //元信息(非必填)
      icon: '',  //路由图标
      title: '',   //路由名称
      light: '',    //高亮显示那个路由name
      show: true,   //是否显示
   },
   redirect: {   
      name: '',    //重定向,指向哪个路由的name
   },
   component: '',    //当前路由时要显示的组件
   children: [],    //嵌套子路由
}
lancelote-zpc

lancelote-zpc commented on Mar 18, 2020

@lancelote-zpc
<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中写一个路径就可以

lancelote-zpc

lancelote-zpc commented on Mar 18, 2020

@lancelote-zpc

忘了说 还有一种是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>
Funqiewei

Funqiewei commented on Mar 10, 2022

@Funqiewei

routes:[{ path: "/", redirect: '/xxxxxx' }]

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @wenyejie@haizhilin2013@zhengao261@liuxiaoyang1@zlqGitHub

        Issue actions

          [vue] vue-router怎么重定向页面? · Issue #419 · haizlin/fe-interview