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 ...
随机推荐
- [GO]字符串的使用
package main import ( "fmt" "strings" ) func main() { //判断字符串1是否包含字符串2,如果包含则返回tr ...
- 34 输入3个数a,b,c,按大小顺序输出
题目:输入3个数a,b,c,按大小顺序输出 public class _034Sorting { public static void main(String[] args) { sorting(); ...
- C# JSON使用过程中开发的小工具
我在用JSON的过程中,经常要去看一下JSON的结构,而JSON串大不部分时候都是未格式化的数据,一次我不得不用一些网页上的在线解析和格式化工具来进行格式化查看,但是这些网页有时候并不好用:因此就结合 ...
- SpringMVC源码解读 - RequestMapping注解实现解读 - ConsumesRequestCondition
consumes 指定处理请求的提交内容类型(media-Type),例如application/json, text/html. 所以这边的ConsumesRequestCondition就是通过 ...
- 昨天发现的nginx默认不支持下划线引起angular-phonecat项目部分文件404问题
今天发现原来确实是不存在这个文件... 因为我的Ubuntu的git没有安装,所以导致bower install时没有拉下来依赖包,因为bower是使用的git拉的包. 但是同时也搜到了nginx不支 ...
- 【转载】C#操作XML
这个网上一大把,对XML操作先转载,以后研究一下 C#读取XML时候如何获取最好的性能. Fash Li 的XML读取写的非常的清晰,这里直接转载了,多谢各位博友的无私分享,能让大家有更多的时间研究未 ...
- IIS应用程序池自动回收作业
vb: appPoolName = WScript.Arguments() Set oWebAdmin = GetObject("winmgmts:root\WebAdministratio ...
- Javascript:日期排班功能实现
背景: 近期,公司的产品经常会遇到日期排班类似的功能: 需求的排班日期长短不一:有些是两周,有些是四周:要求选中的时候有一个active的状态区分,另外要提供钩子获取选中日期的形如:[2018-04 ...
- OI数据结构&&分治 简单学习笔记
持续更新!!! [例题]简单题(K-D tree) 题目链接 线段树 [例题](环上最大连续和) 给定一个长度为n的环形序列A,其中A1与A_n是相临的,现在有q次修改操作,每次操作会更改其中一个数, ...
- 201621123012 《Java程序设计》第11周学习总结
作业11-多线程 1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多线程相关内容. 2. 书面作业 本次PTA作业题集多线程 1. 源代码阅读:多线程程序BounceThread ...