目标：取消在原页面，确认返回上一级
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
vite官网[https://vitejs.cn/]创建方法官网写的很清楚：新建vue3[https://vite...
目的：搭建vue2/vue3 + webpack多页面，vite/vue3 请看下一篇vite + vue3多页面...
Vue3 在采用 compositionAPI 时候,Vite编译报错: [vite] Internal serv...
伴随着 vue3 的发布，vue 全家桶又添新成成员 ——vite 脚手架工具；相比 @vue/cli 基于浏览器...
一、 安装 Vite 二、使用Vite创建vue3项目 三、安装依赖，运行项目
在上一篇 Vite + Vue3 初体验 —— Vite 篇[https://github.com/a102956...
如果没有啥特别的需求还是推荐vue-cli！ vite vue3 TSX项目 虽然vite 很香，但是vite r...
使用如下方法可实现 history.pushState(null,null, document.URL); win...
基于 Vue3 + Typescript + Vite2 打造网易云音乐播放器 Vue3 全家桶，Composit...
近期，随着 vue3 的各种曝光，vite 的热度上升，与 vite 类似的 snowpack 的关注度也逐渐增加...
本文标题：VUE3 + vite 拦截浏览器后退的方法
本文链接：https://www.haomeiwen.com/subject/fhxuvdtx.html
网友评论