uniapp的webview实现左滑返回上一个页面

uniapp默认左滑是关闭整个webview,而不是关闭当前页 实现思路:拦截webview的url跳转操作,将新url用webview组件重新打开,当左滑的时候,默认关闭的就是当前webview,继而跳转到上一次的页面中

<template><view><web-view :src="weburl" :update-title="false" :webview-styles="webviewStyles"></web-view></view>
</template><script>export default {data() {return {// 进度条webviewStyles: {progress: {color: '#FF3333'}},weburl: ""};},onLoad(option) {console.log("接收到的url参数是:", option.weburl); //打印出上个页面传递的参数。this.weburl = option.weburl},onReady() {var pages = getCurrentPages();var page = pages[pages.length - 1];var currentWebview = page.$getAppWebview();var url = currentWebview.children()[0].getURL();console.log('=== url ===', url);var wv = currentWebview.children()[0];wv.overrideUrlLoading({mode: 'reject',match: '.*'}, function(e) {console.log('reject url: ' + e.url);uni.navigateTo({url: `/pages/webbox/webbox?weburl=${e.url}`})});},onBackPress(e) {let pages = getCurrentPages()let page = pages[pages.length - 1];let currentPages = page.$getAppWebview()currentPages.close()return false},onNavigationBarButtonTap() {console.log("点击了标题栏按钮")uni.$emit("showMenu")},methods: {}}
</script><style lang="scss"></style>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/74219.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

LeetCode 731. My Calendar II【设计,有序映射,差分;线段树】中等

本文属于「征服LeetCode」系列文章之一&#xff0c;这一系列正式开始于2021/08/12。由于LeetCode上部分题目有锁&#xff0c;本系列将至少持续到刷完所有无锁题之日为止&#xff1b;由于LeetCode还在不断地创建新题&#xff0c;本系列的终止日期可能是永远。在这一系列刷题文章…

剑指 Offer 07. 重建二叉树

题目描述 输入某二叉树的前序遍历和中序遍历的结果&#xff0c;请构建该二叉树并返回其根节点。 假设输入的前序遍历和中序遍历的结果中都不含重复的数字。 解题思路 首先&#xff0c;根据前序遍历结果确定根节点。前序遍历的第一个元素即为根节点的值。 接下来&#xff0c…

第17节-PhotoShop基础课程-画笔修复工具

文章目录 前言1.画笔工具1.基本操作2.工具选项1.不透明度2.流量3.平滑2.画笔大小工具栏大小设置 4.笔刷 2.铅笔工具3.颜色替换工具 批量替换颜色4.混合器画笔工具-人像精修 前言 画笔工具的使用 1.画笔工具 1.基本操作 画画 2.工具选项 1.不透明度 2.流量 设置低了会有间隔&…

第29节-PhotoShop基础课程-滤镜库

文章目录 前言1.滤镜库2.Camera Raw滤镜 &#xff08;用来对图片进行预处理&#xff0c;最全面的一个&#xff09;3.神经滤镜&#xff08;2022插件 需要先下载&#xff09;4.液化&#xff08;胖-> 瘦 矮->高&#xff09;5.其它滤镜1.自适应广角2.镜头矫正 把图片放正3.消…

Kafka详解

目录 一、消息系统 1、点对点的消息系统 2、发布-订阅消息系统 二、Apache Kafka 简介 三、Apache Kafka基本原理 3.1 分布式和分区&#xff08;distributed、partitioned&#xff09; 3.2 副本&#xff08;replicated &#xff09; 3.3 整体数据流程 3.4 消息传送机制…

通过jr-qrcode生成二维码并下载到客户端本地(Vue)

生成二维码 首先生成二维码图片的地址 引入jr-qrcode import jrQrcode from jr-qrcode; 生成二维码图片的地址 // 生成二维码地址 getQRCodeUrl(spreadUrl) {const QRCodeUrl jrQrcode.getQrBase64(spreadUrl);return QRCodeUrl; }that.backUrl jrQrcode.getQrBase64(da…

JP《乡村振兴振兴战略下传统村落文化旅游设计》许少辉书香续,山水长

JP《乡村振兴振兴战略下传统村落文化旅游设计》许少辉书香续&#xff0c;山水长

Vue2+Vue3基础入门到实战项目(前接六 副线一)—— 面经 项目

day1 接口文档地址&#xff1a;https://www.apifox.cn/apidoc/project-934563/api-20384515 一、项目功能演示 1.目标 启动准备好的代码&#xff0c;演示移动端面经内容&#xff0c;明确功能模块 2.项目收获 二、项目创建目录初始化 vue-cli 建项目 1.安装脚手架 (已安装…

Python的sort()与sorted()函数详解

目录 sort&#xff08;&#xff09;函数 sorted&#xff08;&#xff09;函数 key参数 区别 sort&#xff08;&#xff09;函数 sort()方法&#xff1a;该方法用于原地对列表进行排序&#xff0c;即直接在原始列表上进行排序操作&#xff0c;并不返回一个新的列表。 my_l…

MySQL MHA

什么是 MHA MHA&#xff08;Master High Availability&#xff09;是一套优秀的MySQL高可用环境下故障切换和主从复制的软件 MHA 的出现就是解决MySQL 单点故障的问题 MySQL故障切换过程中&#xff0c;MHA能做到0-30秒内自动完成故障切换操作 MHA能在故障切换的过程中最大程度上…

WebSocket的那些事(5-Spring STOMP支持之连接外部消息代理)

目录 一、序言二、开启RabbitMQ外部消息代理三、代码示例1、Maven依赖项2、相关实体3、自定义用户认证拦截器4、Websocket外部消息代理配置5、ChatController6、前端页面chat.html 四、测试示例1、群聊、私聊、后台定时推送测试2、登录RabbitMQ控制台查看队列信息 五、结语 一、…

第4章_瑞萨MCU零基础入门系列教程之瑞萨 MCU 源码设计规范

本教程基于韦东山百问网出的 DShanMCU-RA6M5开发板 进行编写&#xff0c;需要的同学可以在这里获取&#xff1a; https://item.taobao.com/item.htm?id728461040949 配套资料获取&#xff1a;https://renesas-docs.100ask.net 瑞萨MCU零基础入门系列教程汇总&#xff1a; ht…

uniApp监听左右滑动事件

监听左右滑动事件的步骤 1. 添加需要监听滑动事件的元素 在你的页面中&#xff0c;添加需要监听滑动事件的元素。这可以是一个 view、swiper 或其他组件&#xff0c;取决于你的需求。例如&#xff1a; <template><view class"body" touchstart"touc…

deepin V23通过flathub安装steam畅玩游戏

deepin V23缺少32位库&#xff0c;在星火商店安装的steam,打开报错&#xff0c;无法使用&#xff01; 通过flathub网站安装steam,可以正常使用&#xff0c;详细教程如下&#xff1a; flathub网址&#xff1a;主页 | Flathub 注意&#xff1a;flathub下载速度慢&#xff0c;只…

Redis从基础到进阶篇(四)----性能调优、分布式锁与缓存问题

目录 一、Redis 集群演变 1.1 ReplicationSentinel*高可用 1.2 ProxyReplicationSentinel(仅仅了解) 1.3 Redis Cluster 集群 (重点&#xff09; 1.3.1 Redis-cluster架构图 1.3.2 工作原理 1.3.3 主从切换 1.3.4 副本漂移 1.3.5 分片漂移 二、Redis版本历史&#xf…

ODC现已开源:与开发者共创企业级的数据库协同开发工具

OceanBase 开发者中心&#xff08;OceanBase Developer Center&#xff0c;以下简称 ODC&#xff09;是一款开源的数据库开发和数据库管理协同工具&#xff0c;从首个版本上线距今已经发展了三年有余&#xff0c;ODC 逐步由一款专为 OceanBase 打造的开发者工具演进成为支持多数…

xCode14.3.1运行MonkeyDev出现“Executable Not Found“的解决办法

安装MonkeyDev遇到的坑 环境&#xff1a;Xcode Version 14.3.1 (14E300c) 错误提示 is not a valid path to an executable file. 报错 /Users/xxxx//Library/Developer/Xcode/DerivedData/MonTest-ccparhdyzjuqhjdergwrngpfwwoh/Build/Products/Debug-iphoneos/MonTest.app…

go-zerogo web集成redis实战

前言 上一篇&#xff1a;go-zero&go web集成JWT和cobra命令行工具实战 从零开始基于go-zero搭建go web项目实战-03集成redis实战 源码仓库地址 源码 https://gitee.com/li_zheng/treasure-box golang redis 客户端 Go-Redis 地址&#xff1a; GitHub: https://github.…

Maven 知识点总结

文章目录 Maven1、Maven 坐标2、Maven 仓库3、Maven 依赖依赖配置依赖范围依赖调解原则排除依赖 4、Maven 生命周期5、Maven 聚合与继承 Maven Maven是一个项目管理工具&#xff0c;它包含了项目对象模型&#xff08;POM&#xff1a;Project Object Model&#xff09;&#xf…

windows系统docker中将vue项目网站部署在nginx上

一、首先在windows系统上下载并安装docker&#xff0c;要下载windows版本 https://www.docker.com/products/docker-desktop/ PS&#xff1a;安装过程中需要WSL&#xff0c;我的是win11系统&#xff0c;直接提示了我安装就可以下一步了。其他windows系统版本我不知道是否需要单…