vue和浏览器返回操作一致

methods: {
  goBack() {
    // 返回上一页
    this.$router.go(-1);
    // 关闭当前页面;
    this.$store.dispatch("tagsView/delView", this.$route);
  }
},
mounted(){
  if (window.history && window.history.pushState) {
    history.pushState(null, null, document.URL);
    window.addEventListener("popstate", this.goBack);
  }
},
destroyed() {
  window.removeEventListener("popstate", this.goBack);
}

 在需要后退的页面加如上代码

 监控路由并立即执行

watch: {
    $route: {
      handler(nv, ov) {
        // console.log(nv)//新路由信息
        this.path = nv.path
        // console.log(ov);//老路由信息
      },
      // 深度观察监听
      deep: true,
      // immediate表示在watch中首次绑定的时候,是否执行handler,值为true则表示在watch中声明的时候,就立即执行handler方法
      immediate:true
    }
  }

 

posted @ 2022-10-25 16:38  ronle  阅读(142)  评论(0编辑  收藏  举报