vue-router中怎么保持一个参数永远存在(参数透传)?

我们有个页面上报的脚本依赖url参数deviceid,那个js因为是公共的不好改,所以希望所有页面都能自动带着deviceid

比如,如果用户打开了

localhost/index?deviceid=123

那么他通过任意的router-link

<router-link :to="{name:'Detail',``query:{id:item.id}}"></router-link>

打开detail页面,希望可以自动带着deviceid

localhost/detail?deviceid=123&id=111

请问这种要怎么实现?

回答:

router.beforeEach((to, from, next) => {
  if (!to.query.deviceid) {
    next({
      path: to.path,
      query: {
        deviceid: 1001
      }
    });
  } else {
    next();
  }
});

回答:

可以直接用vue-router的导航钩子:beforeEach()

router.beforeEach((to, from, next) => {
  to.query.detailid = 'name';
  console.log(to);
  next();
});

这样就可以对每个路由都设置参数detailid。然后可以就可以在别的地方获取到这个参数值了。
图片描述

暂无评论

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注