Vue路由跳转后返回上一页的问题

Question

Vue项目里有四个页面，分别是index入口文件，A，B，C，其中A,B,C里均使用history.go(-1)返回上一页，
它们的跳转关系是

index⇢A⇢B⇢C，其中C页面里有跳转按钮可以跳转到A页面，现在希望从C页面跳转到A页面后，不能再通过A页面的返回按钮返回C，而是返回index，它们的最终跳转关系是

index⇢A⇢B⇢C⇢A⇢index

目前跳转的代码如下，但A页面总是会返回C：

index: $router.push({name:'A'})
A: $router.push({name:'B'})
B: $router.push({name:'C'})
C: $router.replace({name:'A'})

请问这种需求的跳转应该怎么实现呢？

Answer 1

如果A不能直接跳转到C
可以在A页面使用 beforeRouteLeave 判断你的目的页面，如果是C 则 强制跳转到index

 beforeRouteLeave(to, from, next){
    if(to.name == "C"){
      this.$router.push({name:"index"});
    }else{
      next();
    }
  },

Answer 2

可以使用路由钩子beforeRouteLeave，指定离开A页面的时候跳到哪里去