Vue 单页面处理手机返回键问题

在用Vue开发单页面App时候，有时会遇到要处理返回按键的逻辑，让它不是返回默认的上一级页面，而是转到指定的页面。百度了查了一下，网上给的方法基本都是通过监听“popstate”，并不能完美解决。后来想到了Router的“导航守卫”，在离开时进行处理一下即可。话不多说，直接上例子：

beforeRouteLeave (to, from, next) {if(this.success){next({path:'/home'});//重定向到指定路径}else{next()}}

就是在next()方法里面重定向就行。完美解决，还不用绑定监听再解绑监听。

Vue 单页面处理手机返回键问题相关推荐

mui+vue监听安卓手机返回键
1.引入mui之后,在index.html中初始化mui,可以不设置keyEventBind,默认监听back,menu键 <script src=&qu ...
混合开发中，H5页面如何监听Android手机返回键
1. 前言混合开发中,如果当前操作的页面是H5写的.那么这个时候点击Android手机返回键,默认是返回到上一个页面,跟浏览器的回退功能是一样的,都是返回到历史记录中的前一个记录.看着好像没啥问题, ...
VUE 返回上一页不刷新页面、重复进入同一页面created重复执行、每次进入页面时都执行created、vue单页面多路由，前进刷新，返回不刷新
每次进入页面时都执行created.前进刷新,返回不刷新思路: 利用 keep-alive与vue-router配合使用 ,判断哪些页面需要每次进入刷新,哪些页面不需要每次进入刷新: keepAli ...
移动端监听安卓手机返回键
[场景] 相信大家用安卓手机使用APP的过程中,会遇到这样的一个场景:按下手机的返回键时,会弹出一个询问框:"是否退出该页面/APP?",然后点击了确认键才真正退出APP.PC端目 ...
app怎么嵌套vue页面_app内嵌vue单页面应用的一些坑
写这篇文章的原因是想总结一下自己最近开发的一个内嵌app的vue单页面项目,看看有哪些坑!!! 1.白屏项目第一次上线正常项目第二次上线,20多个用户反馈白屏(没见过这世面,心里慌的不行!!!), ...
vue index.html 缓存,解决vue单页面回退页面 keeplive 缓存问题
场景:项目中遇到 vue 点击回退从A页跳到B页,缓存A页,当B页状态修改再次返回A时,A页查询条件缓存不刷新,列表刷新 A页: B页: 解决方法: 利用keep-alive 缓存需要缓存的页面 1 ...
在不使用ssr的情况下解决Vue单页面SEO问题
遇到的问题: 近来在写个人博客的时候遇到了大家可能都会遇到的问题 Vue单页面在SEO时显得很无力,尤其是百度不会抓取动态脚本 Vue-Router配合前后端分离无法让meta标签在蜘蛛抓取时动态填充 ...
移动端监听安卓手机返回键 1
[场景] 相信大家用安卓手机使用APP的过程中,会遇到这样的一个场景:按下手机的返回键时,会弹出一个询问框:"是否退出该页面/APP?",然后点击了确认键才真正退出APP.PC端目 ...
手机端网页处理手机返回键
// 手机端网页: 处理手机返回键 window.onpopstate = function (event) {// 监听到已经按下返回键,获取URL var url = "" + ...

Vue 单页面处理手机返回键问题

Vue 单页面处理手机返回键问题相关推荐

最新文章

热门文章