uniapp实现webview页面关闭功能

实现思路:

1.关闭按钮是使用原生button添加的close属性。(见page.json页面)

2.监听关闭按钮的方法。(onNavigationBarButtonTap)

3.写实现关闭webview所有页面的逻辑。

废话不多说,直接上代码

1.page.json添加关闭按钮

2.webview页面实现关闭逻辑

实现代码:

<template>
	<view v-if="params.url">
		<web-view :webview-styles="webviewStyles" :src="`${params.url}`"></web-view>
	</view>

</template>

<script>
	export default {
		data() {
			return {
				params: {
					url: "https://www.hgjt.com/"
				},
				webviewStyles: {
					progress: {
						color: "#027AFF"
					}
				}
			}
		},
		props: {
			src: {
				type: [String],
				default: null
			}
		},
		onLoad(event) {},
		onBackPress(event) {
			console.log(event, 'event')
		},
		onNavigationBarButtonTap(e) {
			if (e.type == 'close') {
				let pages = getCurrentPages()
				let page = pages[pages.length - 1];
				let currentPages = page.$getAppWebview()
				let children = currentPages.children()
				if (children.length === 0) {
					uni.navigateBack()
				} else {
					children[0].close()
					setTimeout(() => {
						uni.navigateBack()
					}, 80)
				}
				return true;
			}
		}
	}
</script>

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

SpringBoot集成Redis主从架构实现读写分离(哨兵模式)

一、前言 这里会使用到spring-boot-starter-data-redis包&#xff0c;spring boot 2的spring-boot-starter-data-redis中&#xff0c;默认使用的是lettuce作为redis客户端&#xff0c;也推荐使用lettuce&#xff0c;Redis使用哨兵集群&#xff0c;这里会通过lettuce连接到哨兵…

C++之Linux syscall实例总结(二百四十六)

简介&#xff1a; CSDN博客专家&#xff0c;专注Android/Linux系统&#xff0c;分享多mic语音方案、音视频、编解码等技术&#xff0c;与大家一起成长&#xff01; 优质专栏&#xff1a;Audio工程师进阶系列【原创干货持续更新中……】&#x1f680; 人生格言&#xff1a; 人生…

2023年清洁电器行业数据分析:洗地机市场规模持续倍增,进入赛点

洗地机作为清洁电器领域的明星品类&#xff0c;正在成为继扫地机器人之后拉动清洁电器市场大盘的又一核心动力。 在清洁电器领域&#xff0c;扫地机器人、洗地机和吸尘器是三大热门品类。截至今年9月份&#xff0c;根据鲸参谋平台的数据显示&#xff0c;吸尘器的规模继续大幅下…

2023年香水行业数据分析:国人用香需求升级,高端香水高速增长

在人口结构变迁的背景下&#xff0c;“Z世代”作为当下我国的消费主力&#xff0c;正在将“悦己”消费推动成为新潮流。具备经济基础的“Z世代”倡导“高颜值”、“个性化”、“精致主义”&#xff0c;这和香水、香氛为代表的“嗅觉经济”的特性充分契合&#xff0c;因此&#…

初始Redis 分布式结构的发展演变

目录 Redis的特点和使用场景 分布式系统的引入 单机系统 分布式系统 应用服务器的增多&#xff08;处理更多的请求&#xff09; 数据库读写分离&#xff08;数据服务器的增多) 引入缓存 应对更大的数据量 业务拆分&#xff1a;微服务 Redis的特点和使用场景 我们先来…

vue重修之Vuex【下部】

文章目录 版权声明Vuex的模块化获取Vuex模块内state数据获取Vuex模块内getters数据获取Vuex模块内mutations方法获取模块内的actions方法总结 版权声明 本博客的内容基于我个人学习黑马程序员课程的学习笔记整理而成。我特此声明&#xff0c;所有版权属于黑马程序员或相关权利…

浮动面试题

浮动元素特点&#xff1a;

B-3:Web安全之综合渗透测试

B-3:Web安全之综合渗透测试 任务环境说明: 服务器场景:Server2104(关闭链接) 服务器场景用户名、密码:未知 1.通过URL访问http://靶机IP/1,对该页面进行渗透测试,将完成后返回的结果内容作为FLAG值提交; 通过访问IP/1,查看源代码发现flagishere,访问后发现什么也没…

Kafka - 异步/同步发送API

文章目录 异步发送普通异步发送异步发送流程Code 带回调函数的异步发送带回调函数的异步发送流程Code 同步发送API 异步发送 普通异步发送 需求&#xff1a;创建Kafka生产者&#xff0c;采用异步的方式发送到Kafka broker 异步发送流程 Code <!-- https://mvnrepository…

【STM32】HAL库ADC多通道精准测量(采用VREFINT内部参考电压)

【STM32】HAL库ADC多通道精准测量&#xff08;采用VREFINT内部参考电压&#xff09; 文章目录 多通道测量VREFINTADC采样周期多通道配置 附录&#xff1a;Cortex-M架构的SysTick系统定时器精准延时和MCU位带操作SysTick系统定时器精准延时延时函数阻塞延时非阻塞延时 位带操作…

热点不热!如何修复笔记本电脑未连接到移动热点的问题

当你远离常规Wi-Fi时,移动热点是让你的笔记本电脑上网的关键,但当它没有按计划运行时,你会怎么办?以下是Windows笔记本电脑无法连接到移动热点时的几种修复方法。 为什么我的笔记本电脑没有连接到我的热点 由于你的笔记本电脑正试图连接到另一个有限制和可能存在问题的设…

docker在java项目中打成tar包

docker在java项目中打成tar包 1、首先安装一个docker desktop 2、mvn install项目后&#xff0c;建立一个自己的dockerfile 这里我以我的代码举例&#xff0c;from 镜像&#xff0c;这里你也能打包好一个镜像的基础上&#xff0c;from打好的镜像&#xff0c;这里我们用openj…

黑豹程序员-架构师学习路线图-百科:API接口测试工具Postman

文章目录 1、为什么要使用Postman&#xff1f;2、什么是Postman&#xff1f; 1、为什么要使用Postman&#xff1f; 目前我们开发项目大都是前后端分离项目&#xff0c;前端采用h5cssjsvue基于nodejs&#xff0c;后端采用java、SpringBoot、SSM&#xff0c;大型项目采用SpringC…

Fiddler抓包VSCode和探索

前言&#xff1a; 最近在使用 VSCode 调试 web 程序时&#xff0c;遇到一些问题&#xff0c;当时不知道如何是好。所以决定抓看来看一看&#xff0c;然后一顿操作猛如虎&#xff0c;成功安装了抓包软件 – Fiddler Classic。我并没有使用 Postman 这种重量级的 HTTP 测试软件&a…

JavaScript-2-菜鸟教程

字符串 可以使用 索引 位置访问字符串中的每个字符 可以使用内置属性 length 来计算字符串的长度 var txt "ABCDEFGHIJKLMNOPQRSTUVWXYZ"; var sln txt.length;<script>var x "John"; // x是一个字符串// 使用 new 关键字将字符…

APP破解去广告

1.修改图标和名称 名称直接改 找到图标在进去把他替换掉 2.修改app包名实现分身 修改包名实现app分身_Tian翊的博客-CSDN博客 3.修改资源去广告 安卓逆向006之修改APK资源去广告_修改安装包去除app内广告-CSDN博客 打开模拟器后在cmd命令行输入adb devices连接上 在模拟器中…

【Java 进阶篇】Java Request 原理详解

在网络应用开发中&#xff0c;HTTP请求是一项常见而关键的任务。当我们使用Java编写网络应用时&#xff0c;了解HTTP请求的工作原理变得至关重要。本文将详细介绍Java中HTTP请求的原理&#xff0c;包括请求的结构、发送请求的方法以及处理请求的过程。 HTTP请求的基本结构 HT…

薛定谔的猫重出江湖?法国初创公司AliceBob研发猫态量子比特

总部位于巴黎的初创公司Alice&Bob使用超导芯片的两个相反的量子态&#xff08;他们称之为“猫态量子比特”芯片&#xff09;来帮助开发量子计算的不同自旋方式。&#xff08;图片来源&#xff1a;网络&#xff09; 有的人认为&#xff0c;构建量子计算机的模块模仿了著名的…

用友U8SMSProxy -SQL注入漏洞

0x01 漏洞介绍 用友GRP-U8 R10政务管理软件是由用友政务公司基于云技术所推出的第十代政务产品。这款产品继承了用友R9、R9i、U8等行政事业版产品的各项优点&#xff0c;并融合了全国广大用户的最佳实践应用。它旨在为政府财政部门、社保部门、卫生部门、教育部门、民政部门、党…

代码随想录打卡第五十天|198.打家劫舍 ● 213.打家劫舍II ● 337.打家劫舍III

198.打家劫舍 题目&#xff1a; 你是一个专业的小偷&#xff0c;计划偷窃沿街的房屋。每间房内都藏有一定的现金&#xff0c;影响你偷窃的唯一制约因素就是相邻的房屋装有相互连通的防盗系统&#xff0c;如果两间相邻的房屋在同一晚上被小偷闯入&#xff0c;系统会自动报警。 …