美文网首页
vue this.$router.push 跳转地址不对

vue this.$router.push 跳转地址不对

作者: 牙牙and小尾巴 | 来源:发表于2019-04-24 15:28 被阅读0次

在使用this.$router.push()进行页面跳转时遇到一小问题,带参跳转后,再次通过this.$router.push()进行跳转时,跳转地址与预期不符。

首先,从A页面带参跳转到B页面,在A页面进行跳转如下:

  this.$router.push({
          path: `edittstkkc/${id}`
        });

跳转后的地址为:

http://localhost:9528/tskecheng/edittstkkc/103

然后在B页面进行操作后,希望跳转回A页面,操作如下:

 this.$router.push("tstkkc");

希望得到的地址是

http://localhost:9528/tskecheng/tstkkc

实际上浏览器中的地址如下,this.$router.push是对最后一个/后的内容进行了替换

http://localhost:9528/tskecheng/edittstkkc/tstkkc

做如下修改后,跳转正确

this.$router.push("/tskecheng/tstkkc");或
this.$router.replace("/tskecheng/tstkkc");

路由配置如下:

  {
    path: '/tskecheng',
    component: Layout,
    redirect: '/tskecheng/tstkkc',
    name: 'Tskecheng',
    meta: { title: '特殊团课课程库', icon: 'sp5', roles: ['superadmin'] },
    children: [
      {
        path: 'tstkkc',
        name: 'Tstkkc',
        component: () => import('@/views/kecheng/tstkkc/index'),
        meta: { title: '特殊团课列表', icon: 'sp5', roles: ['superadmin'] },
      },
      {
        path: 'addtstkkc',
        name: 'Addtstkkc',
        component: () => import('@/views/kecheng/tstkkc/add/index'),
        meta: { title: '添加特殊团课', icon: 'sp5', roles: ['superadmin']},
        hidden:true
      },
      {
        path: 'edittstkkc/:tstkid',
        name: 'Edittstkkc',
        component: () => import('@/views/kecheng/tstkkc/edit/index'),
        meta: { title: '编辑特殊团课', icon: 'sp5', roles: ['superadmin']},
        hidden:true
      },
    ]
  }

相关文章

网友评论

      本文标题:vue this.$router.push 跳转地址不对

      本文链接:https://www.haomeiwen.com/subject/vbsggqtx.html