react-native:解决使用webView后部分场景在安卓10崩溃闪退问题

app闪退问题原因:

安卓7以上版本(7和7以下版本不会出现闪退):在屏幕不可视区域加载webView或者webView不在可视区域内切换页面时app崩溃闪退(在屏幕可视区域加载webView或者webView在可视区域内切换页面不会闪退)

解决办法 

  • 进入页面时
    给webView设置状态为false并且延时加载,设置lodding,等其他视图渲染完毕后wevView状态设置为true,然后加载webView。
import {useNavigation} from '@react-navigation/native';const navigation = useNavigation();
const [showChart, setShowChart] = useState(false)
useEffect(() => {dispatch(changeLoading({isShow: true, message: "加载中"}))setTimeout(() => {setShowChart(true);dispatch(changeLoading({isShow:false,message:"加载中"}));}, 1000);
},[])<View>{showChart?<wevViewh5height={scale(150)}h5width={scale(300)}cannotTouch={true}/>:null}
</View>
  • 切换页面时
    设置自定义返回事件,同样延时切换页面,在切换时先销毁webView然后在进行页面切换(这里举例返回上一页)

 

// BackHandler API 用于监听设备上的后退按钮事件,可以调用你自己的函数来处理后退行为。此 API 仅能在 Android 上使用。
// 官网地址:https://reactnative.cn/docs/backhandler
import { TouchableOpacity,BackHandler } from 'react-native'
import {useNavigation} from '@react-navigation/native';const navigation = useNavigation();// 自定义返回按钮
navigation.setOptions({headerBackImage: () => (<TouchableOpacity// pop返回时执行操作onPress={pop}style={{height: scale(34),width: scale(80),paddingLeft: scale(12),justifyContent: 'center',// backgroundColor:'red',}}><Image// 可点击区域设置大一点style={{width: scale(12), height: scale(20)}}source={require('../image/back.png')}/></TouchableOpacity>),
});const pop = () => {// 设置webView状态为false,延时退出setShowChart(false);setTimeout(() => {navigation.pop();}, 200);return true;
}useEffect(() => {if (Platform.OS == 'android') {//添加返回监听事件BackHandler.addEventListener('hardwareBackPress', pop);}return () => {if (Platform.OS == 'android') {// 删除监听事件BackHandler.removeEventListener('hardwareBackPress', pop);}};
},[])

 分割线————————————————————————————

 定位问题与解决问题的过程

 定位问题的过程比较痛苦
开发使用安卓版本:android10
因为项目中已经有很多功能使用webView并没有什么问题,所以当出现闪退的时候并没有第一时间考虑到时webView的问题(踩坑无数)

解决问题的过程更加痛苦
第一次怀疑是webView的问题的时候是测试在使用android7的模拟器并不会出现闪退现象(初步怀疑可能与安卓10的垃圾回收有关,并没有仔细排查)
后来发现其他功能用到的webView都是在页面可视区域加载且页面不可滑动,后来把闪退页面的webView放到屏幕可视区域并延时渲染在进入页面时不会出现闪退问题(以为解决了)
再后来发现在页面滑动后,webView不在可视区域内进行返回上一页操作时,又出现闪退,然后添加返回监听,延时退出(此时彻底解决问题)(踩坑无数)
                        
原文链接:https://blog.csdn.net/weixin_43413824/article/details/120301018

 

 

 

 

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

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

相关文章

Python——数列1/2,2/3,3/4,···,n/(n+1)···的一般项为Xn=n/(n+1),当n—>∞时,判断数列{Xn}是否收敛

没注释的源代码 from sympy import * n symbols(n) s n/(n1) print(数列的极限为&#xff1a;,limit(s,n,oo))

Java基础——类和对象的定义链表的创建,输出

目录 什么是类&#xff1f; 什么是对象? 如何创建链表&#xff1f; 尾插法&#xff1a; 头插法&#xff1a; 输出链表的长度 输出链表的值 什么是类&#xff1f; 创建Java程序必须创建一个类class. .java程序需要经过javac指令将文件翻译为.class字节码文件&#xff0c…

python代码打包exe文件(可执行文件)

一、exe打包 1、构建虚拟环境 conda create -n env_name python3.8 #env_name,python根据自己需求修改2、保存和安装项目所需的所有库 pip freeze > requirements.txt3、虚拟环境安装项目包、库 pip install -r requirements.txt4、安装pyinstaller pip install pyinst…

【Linux】冯诺依曼体系结构

目录 一、冯诺依曼体系结构二、冯诺依曼体系结构的基本组成三、关于冯诺依曼体系结构的一些问题结尾 一、冯诺依曼体系结构 冯诺依曼体系结构&#xff0c;也称为普林斯顿结构&#xff0c;是现代计算机设计的基础框架。这一体系结构由数学家冯诺依曼在20世纪40年代提出&#xf…

图像信号处理器(ISP,Image Signal Processor)详解

简介&#xff1a;个人学习分享&#xff0c;如有错误&#xff0c;欢迎批评指正。 图像信号处理器&#xff08;ISP&#xff0c;Image Signal Processor&#xff09; 是专门用于处理图像信号的硬件或处理单元&#xff0c;广泛应用于图像传感器&#xff08;如 CMOS 或 CCD 传感器&a…

英飞凌Aurix2G TC3XX GPT12模块详解

英飞凌Aurix2G TC3XX GPT12模块详解 本文主要介绍英飞凌 Aurix2G TC3XX系列芯片GPT12模块硬件原理、MCAL相关配置和部分代码实现。 文章目录 英飞凌Aurix2G TC3XX GPT12模块详解1 模块介绍2 功能介绍2.1 结构2.2 独立运行模式2.2.1 定时器模式2.2.2 门控定时器模式2.2.3 计数…

Python小白学习教程从入门到入坑------第二十九课 访问模式(语法进阶)

目录 一、访问模式 1.1 r 1.2 w 1.3 1.3.1 r 1.3.2 w 1.3.3 a 1.4 a 一、访问模式 模式可做操作若文件不存在是否覆盖r只能读报错-r可读可写报错是w只能写创建是w可读可写创建是a只能写创建否&#xff0c;追加写a可读可写创建否&#xff0c;追加写 1.1 r r&…

【Linux】Linux入门实操——vim、目录结构、远程登录、重启注销

一、Linux 概述 1. 应用领域 服务器领域 linux在服务器领域是最强的&#xff0c;因为它免费、开源、稳定。 嵌入式领域 它的内核最小可以达到几百KB, 可根据需求对软件剪裁&#xff0c;近些年在嵌入式领域得到了很大的应用。 主要应用&#xff1a;机顶盒、数字电视、网络…

十三:java web(5)-- Spring数据持久层

目录 Spring 数据持久层 1. Spring 与 JDBC 1.1 使用 Spring 管理数据库连接 1.1.2 Apache Commons DBCP 基于配置文件xml 使用 1.1.3 Apache Commons DBCP 基于配置类使用 1.1.4 HikariCP 基于配置文件xml 使用 推荐使用 Spring Boot 默认连接池 1.1.5 HikariCP 基于配置…

uniApp之uni-file-picker使用踩坑

标题党~也不算坑吧 就是初体验 上传是需要存储一下子的&#xff0c;我以为uniApp是自己免费开的服务给大家中转使用&#xff0c;就没管这个事&#xff0c;但是官网是这么说的&#xff1a; 就我是怎么发现的&#xff0c;使用了一段时间后&#xff0c;上传的图片都裂了&#xff…

开源竞争-大数据项目期末考核

开源竞争&#xff1a; 自己没有办法完全掌握技术的时候就开源这个技术&#xff0c;培养出更多的技术依赖&#xff0c;让更多人完善你的技术&#xff0c;那么这不就是在砸罐子吗&#xff1f;一个行业里面总会有人砸罐子的&#xff0c;你不如先砸还能听个想。 客观现实&#xf…

Flutter3.22.2中SliverAppBar设置背景色滑动显示颜色错误

在使用Flutter项目开发中&#xff0c;可能会有页面需要滑动收起标题栏的效果&#xff0c;一般都会使用SliverAppBar来实现&#xff0c;当项目的Flutter的SDK版本升级到3.4后&#xff0c;发现使用了SliverAppBar的页面&#xff0c;在滑动过程中&#xff0c;标题栏和状态栏的颜色…

SpringBoot3中swagger无法使用

前言 springboot 3开始javax包改成了jakarta&#xff0c;而swagger-oas等包中依然使用的是javax&#xff0c;所以报错。另外springfox已经停止更新有段时间了&#xff0c;并且不支持OpenAPI 3标准&#xff0c;升级Springboot 3.0以后会有更多问题暴露出来。而SpringBoot 3只支…

使用docker安装zlmediakit服务(zlm)

zlmediakit安装 zlmediakit安装需要依赖环境和系统配置&#xff0c;所以采用docker的方式来安装不容易出错。 docker pull拉取镜像(最新) docker pull zlmediakit/zlmediakit:master然后先运行起来 sudo docker run -d -p 1935:1935 -p 80:80 -p 8554:554 -p 10000:10000 -p …

第九周预习报告

文章目录 密码系统设计第九周预习报告学习内容AI 对学习内容的总结&#xff08;1分&#xff09;要求总结 对 AI 总结的反思与补充&#xff08;2分&#xff09;反思与补充 补充内容反思学习思维导图&#xff08;2分&#xff09;要求思维导图代码导图 基于 AI 的学习&#xff08;…

GB/T 43206—2023信息安全技术信息系统密码应用测评要求(五)

文章目录 附录AA.1 概述A.2 密钥产生A.3 密钥分发A.4 密钥存储A.5 密钥使用A.6 密钥更新A.7 密钥归档A. 8 密钥撤销A.9 密钥备份A.10 密钥恢复A.11 密钥销毁 附录B附录C 附录A A.1 概述 密钥管理对于保证密钥全生存周期的安全性至关重要 ,可以保证密钥(除公开密钥外) 不被非授…

phpstudy 使用php8.2.9版本报错问题

phpstudy 使用php8.2.9版本报错问题 1、如果php8的扩展控制面板开启无效的话&#xff0c;可以手动开启试试 2、php有报错日志&#xff1a; Fatal error: Directive ‘track_errors’ is no longer available in PHP in Unknown on line 0 在切换php版本到更高版本时在终端查…

【科普小白】LLM大语言模型的基本原理

一、要了解LLM大模型的基本原理就要先来了解一下自然语言处理&#xff08;NLP&#xff09;。 NLP 是 AI 的一个子领域&#xff0c;专注于使计算机能够处理、解释和生成人类语言&#xff0c;主要任务包括&#xff1a;文本分类、自动翻译、问题回答、生成文本等。到底是NLP促生了…

初识网络编程TCP/IP

目录 前言相关名词解释应用层协议——HTTP传输层协议socketTCP帧头格式三次握手、四次挥手 UDPTCP的socket实现 参考博文 前言 刚碰到网络编程&#xff0c;会出现一堆协议、概念、这层次那技术的&#xff0c;头都大了&#xff0c;还是得总结总结…… 相关名词解释 ✨✨网络…

整合本地市场机会 同城小程序打造社区商圈

同城市场中&#xff0c;商家与消费者之间的互动和交易模式正在发生深刻变化&#xff0c;同城小程序成为了企业、商户和消费者之间连接的桥梁&#xff0c;成为打造社区商圈、整合本地市场机会的重要工具。今天小编分享&#xff0c;同城小程序怎么一个软件整合以前十几个APP做的事…