vue移动端更改手机物理按键返回问题
又是一天见面的日子,春季盎然~ 已经无法在继续抒情下去了,写作水平骤降!!
今天记录下应用cordva+vue生成的apk 在手机物理返回时遇到的问题;
前提说~~应用vue,我们可以自定义上一路径和下一路径,其实就是在开发webapp时,我们通常会在webapp的头部导航栏自定义返回的上层路径,但是,手机的物理路径并不是像上层路由那样直接返回了,手机物理返回,按照html5 的history的路径进行返回,因此想要手机物理返回也按照我们和头部一样的返回,还需要自己定义;
方法一:
使用路由钩子 应用beforeRouterLeave路由离开时进行监听以及更改要返回的路径:代码如下:
beforeRouteLeave (to, from, next) {
this.$router.push({path: 'index'})//返回键要返回的路
}
缺点:如果页面上有其他的路由跳转,这样也会调用到beforeRouteLeave里面,这样其他的路由就会失效~有点不符合我们所需
基于方法1,进行加工
beforeRouteLeave (to, from, next) {
if (this.flag) {//这是一个点击事件
next(); //正常执行手机返回键也是正常返回上一个路由
} else {
if (from.path !== 'index') { //要离开的路由不是index
next();//
}
this.$router.push({path: 'index'})//返回键要返回的路由
}
}
优点:监控了页面其他路由的点击事件,这样在返回到指定的页面中肯定是无问题的,排除了其他路由的影响~给个赞
vue移动端更改手机物理按键返回问题的更多相关文章
- python+appium模拟手机物理按键操作
一句代码:driver.keyevent() 括号里填入的是手机物理按键的数字代号 driver.press_keycode() 括号里填入的是键盘按键的数字代号 手机物理 ...
- vue移动端 实现手机左右滑动入场动画
app.vue <template> <div id="app"> <transition :name="transitionName&qu ...
- python+appium的物理按键代码
代码就一句driver.keyevent()括号内填入的是物理按键的数字代号 代号表: 电话键 KEYCODE_CALL 拨号键 5 KEYCODE_ENDCALL 挂机键 6 KEYCODE_HOM ...
- js history对象 手机物理返回键
有兴趣的可以了解下history对象,不感兴趣也可以直接跳到手机物理返回键监听部分 使用场景: 场景1:项目中一个表单页面,需得填写验证码,填写验证码后提交,由于使用的form直接提交,没有使用AJA ...
- android4.0下如何判断手机是否有底部物理按键(menu物理按键)
某些手机底部是在触摸屏内部有软按键,就是如(back,home,menu 等)而有的手机底部(非屏幕内部)有物理按键,就是生产厂商不愿意有google自带的虚拟按键,而做的电容式的物理按键,如(bac ...
- JavaScript监听手机物理返回键的两种解决方法
JavaScript没有监听物理返回键的API,所以只能使用 popstate 事件监听. 有两个解决办法: 1.返回到指定的页面 pushHistory(); window.addEventList ...
- vue实现PC端调用摄像头拍照人脸录入、移动端调用手机前置摄像头人脸录入、及图片旋转矫正、压缩上传base64格式/文件格式
进入正题 1. PC端调用摄像头拍照上传base64格式到后台,这个没什么花里胡哨的骚操作,直接看代码 (canvas + video) <template> <div> &l ...
- VueApp监听手机物理返回键的事件
代码 第一步创建js文件夹子 在main里面引用 JS文本内容如下 //监听手机物理返回键的事件 document.addEventListener('plusready', function() ...
- appium 点击物理按键
有时候我们遇到一些需要点击手机物理返回按键,或者home键等操作,总结如下: adb shell input keyevent 点击home键: adb shell input keyevent 3 ...
随机推荐
- python 数据清洗
前言 1. 删除重复 2. 异常值监测 3. 替换 4. 数据映射 5. 数值变量类型化 6. 创建哑变量 统计师的Python日记[第7天:数据清洗(1)] 前言 根据我的Python学习计划: N ...
- logcat命令详解【一】
Android日志系统提供了记录和查看系统调试信息的功能.日志都是从各种软件和一些系统的缓冲区中记录下来的,缓冲区可以通过logcat命令来查看和使用. 在使用logcat之前,请确保手机的USB调试 ...
- SIP简介
说明:以下内容来着之前下载的一份文档,现将概念部分摘录在BLog,如需要完整文档将放在文件中或留言. SIP简介,第1部分:SIP初探 时间:2006-04-07作者:Emmanuel Proulx浏 ...
- javascript总结23:javascript 数据类型与变量
1 基本类型和引用类型 JavaScript中的数据类型分为两类:基本类型和引用类型 基本类型:直接存储值,画图解释 Number.String.Boolean Undefined.Null 引用类 ...
- mybatis和spring mvc整合
1.环境 a. jar包 (mybatis+spring mvc运行包+两者整合包mybatis-spring.jar) b.工程目录 c. 配置文件 mybatis:SqlMapConfig.xm ...
- Freemark与spring整合
SpringMVC环境的搭建在这里就不多说了,我们这节主要是FreeMarker与SpringMVC整合 首先,在springmvc的配置文件普通视图之前,加入freemarker的视图 fre-se ...
- heartbeat+nginx搭建高可用HA集群
前言: HA即(high available)高可用,又被叫做双机热备,用于关键性业务.简单理解就是,有2台机器 A 和 B,正常是 A 提供服务,B 待命闲置,当 A 宕机或服务宕掉,会切换至B机器 ...
- nowcoder(牛客网)提高组模拟赛第四场 解题报告
T1 动态点分治 就是模拟..... 但是没有过!! 看了题解之后发现.... 坑点:有可能 \(x<=r\),但是
- 用Visual Studio 2015成功编译、发布UMDF驱动到目标机!!
开发工具:Visual Studio 2015企业版 主 机:windows10 X64企业版,主机是安装了Visual Studio 2015的操作系统,主要进行驱动开发和调试. 目 标 ...
- mysql实际碰到问题汇总
问题1:SQLSTATE[42000]: Syntax error or access violation: 1055 Expression #2 of SELECT list is not in G ...