当前位置: 首页 > news >正文

微信小程序阻止页面返回(包滑动、自动返回键)

这个场景还是挺有意思的,比如某多多,只要你点左上角的返回 好家伙,满满又 花不了 的优惠券就来了,让你拥有一种消费最划算的感觉。

如果你的场景比较简单,只是对左上角的返回进行监听,只需要关闭自带的导航栏,手写导航栏或用ui库的写好的导航栏就好了。然后给写好的导航栏的返回按钮添加一个返回的事件做自己想要实现的场景就好了。

一、自定义导航栏

自定义导航栏配置:

{"path": "pages/login/login","style": {
+		"navigationStyle": "custom"}
}

二、 wx.enableAlertBeforeUnload

如果你的场景点击返回时只用来提示一下用户 类似于用一个showModel(提示框)的展示效果,可以使用wx.enableAlertBeforeUnload,只要一点击左上角的返回就会触发当前事件,如果点击确定退出当前页,如果点击取消留在当前页面。

	onLoad(e) {uni.enableAlertBeforeUnload({message: "返回上页时弹出对话框",success: function (res) {console.log("点击确认按钮了:", res);},fail: function (errMsg) {console.log("点击取消按钮了:", errMsg);},})},

三、page-container 

如果你的场景比较复杂,手机都会有自带的滑动返回,例如ios的滑动返回,安卓的滑动返回和back返回键,就需要用到page-container,他的效果类似于弹窗的形式存在着。

<page-container :show="true"  :duration="false" :overlay="false">存放内容
</page-container>

当点击返回按钮时 会先执行把当前的page-container给隐藏掉,再次点击返回时才能够返回上一页。

在正常逻辑下 如果想要优惠券只弹出一次,只需要把page-container 放在外面 于内容隔离开,当点击关闭时先把page-container给隐藏掉,并不会触发当前页的返回,当关闭page-container时会有离开前的事件,只需要在离开前的事件中添加对应的显示优惠券逻辑即可。

<template><view   ><scroll-view scroll-y="true" style="height: 100vh;" :scroll-top="top"  class="mainBox" @scroll="scroll"><view class="" v-for="item in 99">我是内容</view></scroll-view><page-container :show="true"  :duration="false" :overlay="false" @beforeleave="beforeleave"></page-container></view>
</template>methods:{beforeleave(){uni.showModal({title:'弹出优惠券逻辑'})},
}

 如果呢 你这个项目比较特别特别的恶心,只要你点击左上角的返回我就不让你出去,什么时候点击我指定的返回你才够出去,什么都得听我的! 实现思路也是一直在原地进入当前页面。好处就是我能知道你想要返回了,确定就是会有一个进入的加载效果。

完整代码

<template><page-container :show="isShow"  :duration="false" :overlay="false"  @beforeleave="beforeleave" @afterleave="afterleave"   ><scroll-view scroll-y="true" style="height: 100vh;" :scroll-top="top"  class="mainBox" @scroll="scroll"><view class="back" @click="back">指定返回按钮</view><view class="" v-for="item in 99">我是内容</view></view></scroll-view></page-container>
</template><script>export default {data() {return {isShow:true, top:0,scrollTop:0,}},onLoad(e) {this.top = e.top},methods: {back(){this.isShow = falseconsole.log('点击返回了');uni.navigateBack()},beforeleave(){if(!this.isShow) return uni.navigateBack()console.log('点击返回了');uni.redirectTo({url:`/pages/mine/test?top=${this.scrollTop}`,fail(err) {console.log(err);}})},// 需要在退出一次 否则退不出去afterleave(){if(!this.isShow) return uni.navigateBack()},// 记录当前位置 下次进来时自动转到刚才的位置scroll(e){this.scrollTop = e.target.scrollTop}},}
</script>

 

 

相关文章:

微信小程序阻止页面返回(包滑动、自动返回键)

这个场景还是挺有意思的&#xff0c;比如某多多&#xff0c;只要你点左上角的返回 好家伙&#xff0c;满满又 花不了 的优惠券就来了&#xff0c;让你拥有一种消费最划算的感觉。 如果你的场景比较简单&#xff0c;只是对左上角的返回进行监听&#xff0c;只需要关闭自带的导航…...

视频直播美颜sdk的发展史

视频直播美颜sdk的出现是必然的&#xff0c;它的诞生就是为了让更多用户能够更好地体验到视频直播带给大家的快乐&#xff0c;可以说视频直播美颜sdk的发展和用户体验有着紧密联系。今天&#xff0c;小编不聊技术&#xff0c;咱们来聊一下视频直播美颜sdk的诞生以及发展历程。 …...

【Mysql】存储过程

【Mysql】存储过程 文章目录【Mysql】存储过程1.存储过程1.1 存储过程概述1.2 特点1.3 基本语法1.3.1 创建1.3.2 调用1.3.3 查看1.3.4 删除1.4 变量1.4.1 系统变量1.4.2 用户定义变量1.4.3 局部变量1.5 if1.6 参数1.7 case1.8 循环1.8.1 while1.8.2 repeat1.8.3 loop1.9 游标1.…...

Day895.MySql误删数据还原方案 -MySQL实战

MySql误删数据还原方案 Hi&#xff0c;我是阿昌&#xff0c;今天学习记录的是关于MySql误删数据还原方案的内容。 传统的高可用架构是不能预防误删数据的&#xff0c;因为主库的一个 drop table 命令&#xff0c;会通过 binlog 传给所有从库和级联从库&#xff0c;进而导致整…...

Java方法引用

2 方法引用 在使用Lambda表达式的时候&#xff0c;我们实际上传递进去的代码就是一种解决方案&#xff1a;拿参数做操作那么考虑一种情况: 如果我们在Lambda中所指定的操作方案&#xff0c;已经有地方存在相同方案&#xff0c;没有必要再写重复逻辑&#xff0c;如usePrintable…...

C++教程之迭代器Iterator

前言 之前的两篇文章我们主要了解了vector和string的相关知识&#xff0c;从中我们知道可以通过下标来访问vector的元素或者string的字符&#xff0c;但是除了这种方式还有一种更为通用的方式获取元素&#xff0c;那就是迭代器&#xff0c;这篇文章就会简单介绍迭代器的相关内…...

容联七陌:ChatGPT大模型能力为智能客服带来新方向

科技云报道原创。 近几个月来&#xff0c;大众对ChatGPT预期的持续走高&#xff0c;也影响到了智能客服领域公司的命运。 一方面&#xff0c;ChatGPT的出现为智能客服场景带来了更加“智能”的可能性&#xff1b;但另一方面&#xff0c;有人认为ChatGPT完全可以替代现有的智能…...

【Linux 多线程同步】使用同步和互斥实现生产消费模型

目录 1.同步的接口 2.多线程但是按顺序来执行 3.生产消费模型 4.使用互斥加同步实现生产消费模型 &#xff08;采用环形队列&#xff09; 同步&#xff1a;在保证数据安全的前提下&#xff0c;让线程能够按照某种特定的顺序访问临界资源&#xff0c;从而有效避免饥饿问题 …...

【TypeScript】TypeScript的接口和对象类型(interface):

文章目录一、使用接口约束的时候不能多一个属性也不能少一个属二、重名interface 可以合并&#xff0c;继承三、可选属性 使用?操作符四、任意属性 [propName: string]五、只读属性 readonly&#xff0c;是不允许被赋值的只能读取六、添加函数一、使用接口约束的时候不能多一个…...

7、函数与异常

目录一、函数的概念二、匿名函数三、闭包四、defer五、异常机制一、函数的概念 函数的基本形式 //函数定义。a,b是形参 func argf(a int, b int) { a a b } var x, y int 3, 6 argf(x, y) //函数调用。x,y是实参函数参数&#xff1a; func arg2(a, b int) { //参数类型相…...

Julia 语言环境安装

Julia 语言支持以下系统&#xff1a; LinuxFreeBSDmacOSWindowsAndroid Julia 安装包下载地址为&#xff1a;Download Julia。 Github 源码地址&#xff1a;GitHub - JuliaLang/julia: The Julia Programming Language。 国内镜像地址&#xff1a;Index of /julia-releases/…...

5.1 线程

文章目录1.概述2.多线程的特性2.1 随机性2.2 CPU分时调度2.3 线程的状态2.4 线程状态与代码对照3.多线程代码实现方式1:继承Thread3.1 概述3.2 常用方法3.3 测试多线程的创建方式14.多线程代码实现方式2:实现Runnable接口4.1 概述4.2 常用方法4.3 练习2&#xff1a;测试多线程的…...

通讯录的实现

一、目的&#xff1a;使用C实现通讯录二、包含功能&#xff1a;添加联系人:向通讯录中添加新人&#xff0c;信息包括&#xff08;姓名、性别、年龄、联系电话、家庭住址&#xff09;最多记录1000人显示联系人:显示通讯录中所有联系人信息删除联系人:按照姓名进行删除指定联系人…...

Urho3D导航

Urho3D通过使用Recast和Detour库实现导航网格生成和路径查找。 导航功能通过NavigationMesh和Navigable组件公开。 NavigationMesh从已使用Navigable组件标记的子节点收集几何体。默认情况下&#xff0c;可导航组件的行为是递归的&#xff1a;除非禁用递归&#xff0c;否则也…...

【学习总结】激光雷达与相机外参标定:代码(cam_lidar_calibration)

前段时间尝试了一款激光雷达和相机标定的代码&#xff0c;总结了博客&#xff1a; 【学习总结】激光雷达与相机外参标定&#xff1a;原理与代码 但总觉得那个代码太差劲&#xff0c;而且精度不行&#xff0c;于是又找了些新的代码&#xff0c;体验比之前的好很多&#xff0c;在…...

车载技术开发—{Android CarFrameWork}

Android Automotive平台 Android Automotive是通过Android的通用框架&#xff0c;语言和API来实现的一个全栈&#xff0c;开源&#xff0c;高度可定制的平台。 Android Automotive与整个Android生态系统的关系 Android Automotive是Android的一部分。 Android Automotive不是…...

多城市二手车买卖发布管理小程序开发

多城市二手车买卖发布管理小程序开发 功能特性: 为你介绍二手车微信小程序的功能特性。 车辆分类搜索&#xff0c;支持按品牌、售价、年龄、上牌时间、排量等筛选。 车源发布&#xff0c;支持用户一键发布二手车&#xff0c;平台审核上线&#xff0c;发布可编辑、删除等操作。…...

企业级信息系统开发学习笔记1.2 初探Spring——利用组件注解符精简Spring配置文件

文章目录零、本讲学习目标一、课程引入二、打开项目 - SpringDemo三、利用组件注解符精简Spring配置文件&#xff08;一&#xff09;创建新包&#xff08;二&#xff09;复制四个类&#xff08;三&#xff09;修改杀龙任务类&#xff08;四&#xff09;修改救美任务类&#xff…...

37、基于51单片机乒乓球比赛系统设计

摘要 乒乓球游戏电路是一个对输入信号、输入时机正确与否的8个LED表示乒乓球球台和乒乓球&#xff0c;用数码管模拟显示器&#xff0c;显示比赛局数比分和每局玩家得分的电路。电路并不复杂&#xff0c;整体分为两个模块&#xff1a;一&#xff0c;游戏主模块&#xff1b;二&a…...

VMware虚拟机安装Win11最详细过程以及遇到的这台电脑无法运行Windows11的问题

准备工作 在使用VMware虚拟机安装Win11之前我们先把准备工作做好&#xff0c;以免后续思绪混乱导致出错。 1. 到VMware官网或点击链接下载正版VMware Workstation 16 Pro。 2. 双击打开安装包&#xff0c;点击下一步。 3. 阅读用户许可协议&#xff0c;勾选我接受许可协议中的…...

Oracle查询表空间大小

1 查询数据库中所有的表空间以及表空间所占空间的大小 SELECTtablespace_name,sum( bytes ) / 1024 / 1024 FROMdba_data_files GROUP BYtablespace_name; 2 Oracle查询表空间大小及每个表所占空间的大小 SELECTtablespace_name,file_id,file_name,round( bytes / ( 1024 …...

Vue3 + Element Plus + TypeScript中el-transfer穿梭框组件使用详解及示例

使用详解 Element Plus 的 el-transfer 组件是一个强大的穿梭框组件&#xff0c;常用于在两个集合之间进行数据转移&#xff0c;如权限分配、数据选择等场景。下面我将详细介绍其用法并提供一个完整示例。 核心特性与用法 基本属性 v-model&#xff1a;绑定右侧列表的值&…...

ardupilot 开发环境eclipse 中import 缺少C++

目录 文章目录 目录摘要1.修复过程摘要 本节主要解决ardupilot 开发环境eclipse 中import 缺少C++,无法导入ardupilot代码,会引起查看不方便的问题。如下图所示 1.修复过程 0.安装ubuntu 软件中自带的eclipse 1.打开eclipse—Help—install new software 2.在 Work with中…...

基于Java Swing的电子通讯录设计与实现:附系统托盘功能代码详解

JAVASQL电子通讯录带系统托盘 一、系统概述 本电子通讯录系统采用Java Swing开发桌面应用&#xff0c;结合SQLite数据库实现联系人管理功能&#xff0c;并集成系统托盘功能提升用户体验。系统支持联系人的增删改查、分组管理、搜索过滤等功能&#xff0c;同时可以最小化到系统…...

【FTP】ftp文件传输会丢包吗?批量几百个文件传输,有一些文件没有传输完整,如何解决?

FTP&#xff08;File Transfer Protocol&#xff09;本身是一个基于 TCP 的协议&#xff0c;理论上不会丢包。但 FTP 文件传输过程中仍可能出现文件不完整、丢失或损坏的情况&#xff0c;主要原因包括&#xff1a; ✅ 一、FTP传输可能“丢包”或文件不完整的原因 原因描述网络…...

Visual Studio Code 扩展

Visual Studio Code 扩展 change-case 大小写转换EmmyLua for VSCode 调试插件Bookmarks 书签 change-case 大小写转换 https://marketplace.visualstudio.com/items?itemNamewmaurer.change-case 选中单词后&#xff0c;命令 changeCase.commands 可预览转换效果 EmmyLua…...

绕过 Xcode?使用 Appuploader和主流工具实现 iOS 上架自动化

iOS 应用的发布流程一直是开发链路中最“苹果味”的环节&#xff1a;强依赖 Xcode、必须使用 macOS、各种证书和描述文件配置……对很多跨平台开发者来说&#xff0c;这一套流程并不友好。 特别是当你的项目主要在 Windows 或 Linux 下开发&#xff08;例如 Flutter、React Na…...

Java后端检查空条件查询

通过抛出运行异常&#xff1a;throw new RuntimeException("请输入查询条件&#xff01;");BranchWarehouseServiceImpl.java // 查询试剂交易&#xff08;入库/出库&#xff09;记录Overridepublic List<BranchWarehouseTransactions> queryForReagent(Branch…...

归并排序:分治思想的高效排序

目录 基本原理 流程图解 实现方法 递归实现 非递归实现 演示过程 时间复杂度 基本原理 归并排序(Merge Sort)是一种基于分治思想的排序算法&#xff0c;由约翰冯诺伊曼在1945年提出。其核心思想包括&#xff1a; 分割(Divide)&#xff1a;将待排序数组递归地分成两个子…...

python基础语法Ⅰ

python基础语法Ⅰ 常量和表达式变量是什么变量的语法1.定义变量使用变量 变量的类型1.整数2.浮点数(小数)3.字符串4.布尔5.其他 动态类型特征注释注释是什么注释的语法1.行注释2.文档字符串 注释的规范 常量和表达式 我们可以把python当作一个计算器&#xff0c;来进行一些算术…...