vue之在移动端中当处于首页时路由无法后退

全局：
beforeEach(to,from,next)：在路由跳转前处理
afterEach(to,from)：在路由跳转后处理

查到资料 禁止后退的方法是
history.pushState(null, null, location.href)
即向history中添加一个记录，只是在历史记录堆栈中添加了一条记录（所以第一次点<返回按钮就可以阻止后退，但是再多点几次就失效）
当点击返回按钮时，监听到返回事件（由于微信是一定会执行返回的），这是history就会取出刚添加的记录并替换当前页面的路径。

使用路由导航守卫的beforeEach
在跳转前监听到当前路由是首页，先往历史记录堆栈添加记录

// route.js
const router = new VueRouter({
  routes: [
   {
      path: "/home",
      component: Home,
      meta: { allowBack: false },
	}
  ]
})
router.beforeEach((to, from,next) => {
  // 监听路由变化，阻止首页后退
  let allowBack = true; // 设置默认值
  if (to.meta.allowBack !== undefined) {
    allowBack = to.meta.allowBack;
  }
  if (!to.meta.allowBack) {
      history.pushState(null, null, location.href);
  }
  next()
});

使用路由导航守卫的afterEach

// route.js
const router = new VueRouter({
  routes: [
   {
      path: "/home",
      component: Home,
      meta: { allowBack: false },
	}
  ]
})
router.afterEach((to, from) => {
  // 监听路由变化，阻止首页后退
  let allowBack = true; // 设置默认值
  if (to.meta.allowBack !== undefined) {
    allowBack = to.meta.allowBack;
  }
  if (!to.meta.allowBack) {
    setTimeout(() => {
      history.pushState(null, null, location.href);
    });
  }
});

注意：history.pushState(null, null, location.href)外套个定时器可以保证 location.href是跳转后显示的路由（即跳转到首页后，监听到当前路由是首页，就往历史记录堆栈添加记录）

其实两种都差不多，一个跳转前处理，一个是跳转后处理。

其他思路：（还没试过，之后尝试下再来更新）

1. 监听到当前路由是首页，就去清空历史记录
2. 去监听<返回按钮事件,在该事件中直接处理路由跳转问题
   window.addEventListener(“popstate”, (e) => {}, false); //这个可以监听到返回事件

其他相关问题的博客，可以了解了解~
判断Vue路由回退时有没有上一个路由