解决Vue 浏览器后退无法触发beforeRouteLeave的问题
程序员文章站
2022-05-21 07:52:29
现象
加载第一个组件(这里的第一个意思是浏览器历史记录的第一个,后文称为 待监听组件 )时,正常跳转其他页面可以触发beforerouteleave。 但是 按浏览器的后...
现象
加载第一个组件(这里的第一个意思是浏览器历史记录的第一个,后文称为 待监听组件 )时,正常跳转其他页面可以触发beforerouteleave。 但是 按浏览器的后退按钮监听不到该事件。
解决方案
目前采用比较土且不实用的解决方案。加一层组件,再router.push到 待监听组件 ,使得 待监听组件 非第一个组件,可以正常监听beforerouteleave事件。
注意点:
由于打乱了原来的路由。需要在main.js中添加全局的路由监听
router.beforeeach((to, from, next) => { if (to is '用于跳转的组件' && from is '待监听组件') { router.go(-1) next(false) } else { next() } // 这样当从一个普通页面a进入待监听组件时,在待监听组件中按返回键时能正常进入a })
总结
以上所述是小编给大家介绍的解决vue 浏览器后退无法触发beforerouteleave的问题,希望对大家有所帮助!
上一篇: ai怎么快速手绘漫画风格的办公桌?
下一篇: ai怎么绘制UI袜子标识logo?
推荐阅读
-
解决Idea、WebStorm下使用Vue cli脚手架项目无法使用Webpack别名的问题
-
Vue动态加载图片在跨域时无法显示的问题及解决方法
-
vue.js中v-on:textInput无法执行事件问题的解决过程
-
解决vue js IOS H5focus无法自动弹出键盘的问题
-
Linux 解决Deepin无法在root用户启动Google Chrome浏览器的问题
-
解决Vue 浏览器后退无法触发beforeRouteLeave的问题
-
chrome浏览器中无法使用QQ快速登录问题的解决方法
-
关于Vue-elementUI中,给input手动赋值之后无法修改的问题解决
-
移动端微信内置浏览器(或QQ浏览器)无法识别onclick事件的问题解决
-
解决vue2 在mounted函数无法获取prop中的变量问题