vue-router在两个以上子路由的情况下,跳转出错
先说原因: 子路由的路径如果是 :id 那么在添加相同级别的子路由就是没用的;因为 :id 可以匹配使一个路由匹配多个不同的子路由;
今天做毕设的时候,想在原本就有子路由的 根路径上多加一个子路由,以实现 下方 tabbar 的点击不改变;
{ path: ‘/home‘, name: ‘home‘, component: Home, children: [ { path: ‘:id‘, component: Disc }, { path: ‘search‘, component: Search } ] },
所以我直接将代码加成了这样,导致进入 /home/search 后立即返回了。
解决:
1. 将search改成跟/home同级别; 将search单独写成一个路由,那么tabbar就不方便一直在选中状态了;
2.将 子路由 :id 前面加一个前缀;这样需要改变相应的路由跳转代码;
{ path: ‘/home‘, name: ‘home‘, component: Home, children: [ { path: ‘disc/:id‘, // 在router中就改变了这里 component: Disc }, { path: ‘search‘, component: Search } ] },
正常实现了!!
相关推荐
前端小白 2020-07-19
bowean 2020-07-05
82344699 2020-07-05
85423468 2020-06-26
80437700 2020-05-15
80437700 2020-05-11
85423468 2020-05-05
85423468 2020-07-19
ggkuroky 2020-06-17
89711338 2020-06-14
80437700 2020-06-02
85394591 2020-05-31
85394591 2020-05-15
80324291 2020-05-11
85394591 2020-05-10
85497718 2020-04-29
SelinaChan 2020-04-23