VUE3 + vite 拦截浏览器后退的方法

目标:取消在原页面,确认返回上一级

VUE3中代码(可在需要拦截的vue文件中,也可全局在app.vue中处理)

const onPopState = () => {

  openConfirmModal({

    title: '您还没有保存更改,确认返回吗?',

    confirm: () => {

      window.removeEventListener('popstate', onPopState)

      window.history.go(-1)

    }

  })

}

onMounted(() => {

    history.pushState(null, '', document.URL)

    window.addEventListener('popstate', onPopState, false)

})

onUnmounted(() => {

  // 在组件销毁前,移除 popstate 事件监听

  window.removeEventListener('popstate', onPopState)

})

注:router的mode必须是hash

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容