vue-router如何实现类似于小程序路由跳转的reLaunch方法?

小程序reLaunch的方法

关闭所有页面,打开到应用内的某个页面。

补充一下具体描述:
就是类似于 relaunch 方法,在网页中的表现可以理解为清除掉之前的记录然后没办法回退到前一页或者前几页。
举例来说:
A -> B -> C 正常情况下按回退是 C -> B -> A 的,而我想要的是直接 C 回退不到 B 或者 A 的。 AB的历史记录已经被清除了。

当然实际不可能只有两三条记录,就是想问一下各位大佬有没有类似于实现的方法,非常感谢!


再次补充一下描述(我表达的还不够全面):
就是还会有可能回到上一页的操作,所以我需要自己手动来选择是$router.go(-1)还是用类似于relaunch的这个方法。

阅读 6.1k
6 个回答

网页跟小程序是不一样的。小程序可以有多个打开的页面,网页只有一个。当你打开当前页面时,其他页面就已经关闭了。

是想清除上一页记录?

如果是清除浏览器的历史记录是没办法的
如果是想阻止用户返回上一页,可以通过禁用用户的后退操作来实现

你说的应该是无痕浏览吧?
通过 $route.replace 方式跳转的路由不会被记录到 vue 的历史记录里面

我是这么解决的

  1. 再 vuex 里面定义个变量 relaunchUrl
  2. 在我需要 relaunch 这个模式的时候,先给 vuex 里面的 relaunchUrl 赋值成之前打开过的一个页面
  3. this.$router.go(-1)
  4. 再 router index.js 里面:

    router.beforEach((to,from,next)=>{
     //获取vuex里面存的relaunchUrl
     const url=store..getters['routers/getRelaunchUrl']
    if(url && url.length!==0 && to.name != url){
       router.go(-1)
       return
    }
    //如果达到了就把之前存的清除掉
    if(url && url.length!==0 && to.name === url){
       store.commit('router/clear')
    }
     next()
    
    })
  5. 大体上就是,你需要 relaunch 的页面存到 vuex 里面,然后 go(-1),再路由监听里面监听,如果不是 relaunch 就一直 go(-1),如果是就把存的 vuex 清掉
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题