vue如何清除浏览器历史栈

vue如何清除浏览器历史栈

问题1:由于页面各种跳转,有时候某个页面B会跳转到首页,此时在首页返回上一页应该离开这个项目,而不是返回到B页面。

清除浏览器历史栈
import { useRouter } from "vue-router";
...
const router = useRouter();
const routeHistory = history.length - 1; // 拿到历史记录长度
  if (routeHistory > 1) {
    router.go(-routeHistory);
}

问题2:由于本项目是h5项目,有其他h5(A)跳转到该h5(B)首页,以上代码导致页面直接跳转h5(A)的首页了

在beforeRouteEnter中添加判断后清除浏览器历史栈
import { useRouter } from "vue-router";
...
setup() {
  const router = useRouter();
  const state = reactive({
    flag: true // 是否刚进入改应用
  });
  onMounted(() => {
    if(state.flag) {
      const routeHistory = history.length - 1;
      if (routeHistory > 1) {
        router.go(-routeHistory);
      }
    }
  }
},
beforeRouteEnter(to, from, next) {
  next((state:any) => {
  	// from.fullPath为/是刚进入该应用
  	// 不是/说明是该应用的其他页面返回的
    state.flag= from.fullPath != '/';
  });
},

如过有更好的写法欢迎建议和指正

  • 0
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值