h5或uniapp或微信小程序,实现左上角返回到指定页面,侧滑左滑返回指定页面,安卓物理返回键返沪指定页面解决思路的思考

news/2025/2/16 6:10:18/

h5或uniapp或微信小程序,实现左上角返回到指定页面,侧滑左滑返回指定页面,安卓物理返回键返沪指定页面

  • uniapp开发app,(非微信小程序)
    • uniapp写的微信小程序

uniapp开发app,(非微信小程序)

自定义的左上角返回按钮

<i class="iconfont icon-zuojiantou" style="font-size: 24px;" @click="goBack()"></i>

方法

goBack(){let pages = getCurrentPages();//函数用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面var num=pages.length//当前页面栈总数var backnum//需要返回的页数for(var i =0;i<num;i++){//循环找到指定页面路由所在的页数if(pages[i].route=='pages/xxx/xxx'){console.log(pages[i].route,'pages[i].route')//'pages/xxx/xxxx'你需要返回的页面路由backnum=num-i-1//计算返回的层数,总数-指定页面页数-1}		}console.log(backnum,'backnum')uni.navigateBack({delta:backnum//返回的页面数,如果 delta 大于现有页面数,则返回到首页。})},

安卓物理返回键监听,该方法与生命周期函数同级,也可以尝试放在methods里面。

onBackPress(options){//这里是监听安卓物理返回键或者侧滑左滑返回方式if(options.from=='navigateBack'){return false}else if(options.from=='backbutton'){//物理键默认返回上一级,我们在这里进行了处理this.goBack()//走我们自己的方法return true}else if('xxxx){//也可以是其他方式}}

uniapp写的微信小程序

思路,因为uniapp写的微信小程序用onBackPress监听不到不支持监听安卓物理返回,所以换了个想法,默认认为是安卓物理键或者侧滑左滑返回:如果是我自己的按钮,就走goBackFn的方法,把androidReturn设置为true,离开页面就不会执行beforeDestroy里面的方法;如果是物理按钮返回,那么离开页面,会触发生命周期函数beforeDestroy,所以在销毁页面前,判断是否为物理按键返回,是则调用goBack

自己写的左上角返回按钮
<i class="iconfont icon-zuojiantou" style="font-size: 24px;" @click="goBackFn()"></i>
data里面定义参数

androidReturn:true,//默认安卓物理键返回

定义方法

goBack(){let pages = getCurrentPages();//函数用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面var num=pages.length//当前页面栈总数var backnum//需要返回的页数for(var i =0;i<num;i++){//循环找到指定页面路由所在的页数if(pages[i].route=='pages/xxx/xxx'){console.log(pages[i].route,'pages[i].route')backnum=num-i-1//计算返回的层数,总数-指定页面页数-1}		}console.log(backnum,'backnum')uni.navigateBack({delta:backnum//返回的页面数,如果 delta 大于现有页面数,则返回到首页。})
}

生命周期钩子函数写代码,可以实现微信小程序自带的左上角返回,和安卓物理键,侧滑左滑返回

//uniapp内置了vue,所以可以用vue的生命周期
beforeDestroy() {if(this.androidReturn){console.log('物理键返回')this.goBack()}},

自定义左上角安检的返回

goBackFn(){this.androidReturn=false;this.goBack();},

http://www.ppmy.cn/news/1262695.html

相关文章

使用阿里云国际CDN加速后网站无法访问的排查步骤

使用阿里云国际CDN加速后网站无法访问的排查步骤&#xff0c;下面是一些常见的问题&#xff0c;以&#xff1a;www.c.9he.com为例&#xff0c;如果解决不了来信服务器厂商解决。 检查CDN访问异常是CDN节点的问题还是源站问题 如果是源站访问异常&#xff0c;请直接排查源站服务…

销售技巧培训之如何提高手机销售技巧

销售技巧培训之如何提高手机销售技巧 随着科技的迅速发展&#xff0c;手机已成为我们日常生活中不可或缺的一部分。作为一名手机销售员&#xff0c;了解手机销售技巧是必不可少的。本文将通过案例分析与实践&#xff0c;为你揭示手机销售的奥秘。 一、了解客户需求 在销售过程…

gitlab注册无中国区电话验证问题

众所周知gitlab对中国区不友好&#xff0c;无法直接注册&#xff0c;页面无法选择86的手机号进行验证码发送。 Google上众多的方案是修改dom&#xff0c;而且时间大约是21年以前。 修改dom&#xff0c;对于现在的VUE、React框架来说是没有用的&#xff0c;所以不用尝试。 直接看…

跟着GPT学设计模式之建造者模式

Builder 模式&#xff0c;中文翻译为建造者模式或者构建者模式&#xff0c;也有人叫它生成器模式。允许你创建不同口味的对象同时避免构造器污染。当一个对象可能有几种口味&#xff0c;或者一个对象的创建涉及到很多步骤时会很有用。 现实世界例子&#xff1a;想象一个角色扮…

C++学习笔记(十一)

一、类和对象 C面向对象的三大特性为&#xff1a;封装、继承、多态 C认为万事万物皆为对象&#xff0c;对象上有其属性和行为 例如&#xff1a;人可以作为对象&#xff0c;属性有姓名、年龄、身高......&#xff0c;行为有走、吃、睡觉 车也可以作为对象&#xff0c;属性有轮…

【Fastadmin】fastadmin后台默认分类列表视图和功能美化

目录 前言&#xff1a; 美化前&#xff1a; 美化后&#xff1a; 视图美化代码&#xff1a; 批量添加代码&#xff1a; 前言&#xff1a; fastadmin是一款很好的快速开发php后台框架&#xff0c;也是博主在项目开发中使用最多的&#xff0c;但是项目自带的分类显示有些不尽人…

关于IDEA中maven的作用以及如何配置MAVEN

关于IDEA中maven的作用以及如何配置MAVEN 1、Maven是什么2、Idea中对于Maven的配置3、下载依赖时&#xff0c;Idea下方的显示3.1、Maven中央仓库的下载显示界面3.2、阿里云仓库的下载显示界面 4、Maven在Idea中的使用4.1、clean4.2、validate4.3、compile4.4、test&#xff08;…

IDEA 社区版 add GitLab Account

问题 IntelliJ IDEA Community Edition 2023.3&#xff08;社区版&#xff09;在使用GitLab连接时&#xff0c;使用个人访问令牌出现报错&#xff0c;代码&#xff1a; GraphQL error:[No such type ProjectMember,so it cant be a fraggment condition,Field id doesnt exis…