history.pushState

最新推荐文章于 2025-09-13 17:54:33 发布

原创最新推荐文章于 2025-09-13 17:54:33 发布 · 768 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#push.state

js 专栏收录该内容

41 篇文章

订阅专栏

本文详细介绍了在Vue中如何使用history.pushState方法配合监听popstate事件实现路由切换的监听及回退功能，通过代码示例展示了如何在组件挂载和销毁时正确地添加和清除事件监听器。

mounted(){
      if (window.history && window.history.pushState) {
        // @ts-ignore
        history.pushState(null, null, document.URL);
        window.addEventListener('popstate', this.goBack, false);
      }
}

methods:{
    goBack(){
        console.log('支持');
        this.$router.replace({path: '/'});
        //replace替换原路由，作用是避免回退死循环
      }
}

destroyed() {
    // 清除监听
    window.removeEventListener('popstate', this.goBack, false);
}