[RN]webview在android上进行页面跳转时发生崩溃

最新推荐文章于 2024-05-16 01:38:45 发布

鳕鱼33

最新推荐文章于 2024-05-16 01:38:45 发布

阅读量1k

点赞数

分类专栏： APP RN 文章标签： android webview react native

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/weixin_39388536/article/details/119028730

版权

RN 同时被 2 个专栏收录

22 篇文章 0 订阅

订阅专栏

20 篇文章 1 订阅

订阅专栏

问题描述:
项目里需要嵌入YouTube视频,所以用到了react-native-youtube-iframe。然后页面在android上进行页面跳转时偶尔会出现闪退,因为页面里也用到了webview,所以一开始没发现react-native-youtube-iframe也用到了webview…

总结: 在页面跳转时，react-navigation 会为整个屏幕（包括 webview，并且仅在 android 中）的不透明度设置动画并迅速使其崩溃。

解决方法:
方法1.设置webview的不透明度

<YoutubePlayer 
...
    webViewStyle={ {opacity:0.99} }
/>

方法2.关闭屏幕的导航动画

navigationOptions: { animationEnabled: false }

详情参考:
https://github.com/LonelyCpp/react-native-youtube-iframe/issues/110

WebView recently started crashing on Android on some devices #430

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
[RN]webview在android上进行页面跳转时发生崩溃

问题描述:项目里需要嵌入YouTube视频,所以用到了react-native-youtube-iframe。然后页面在android上进行页面跳转时偶尔会出现闪退,因为页面里也用到了webview,所以一开始没发现react-native-youtube-iframe也用到了webview…总结: 在页面跳转时，react-navigation 会为整个屏幕（包括 webview，并且仅在 android 中）的不透明度设置动画并迅速使其崩溃。解决方法:方法1.设置webview的不透明度&lt
复制链接

扫一扫

专栏目录

鳕鱼33 CSDN认证博客专家 CSDN认证企业博客

码龄7年

47: 原创

54万+: 周排名

160万+: 总排名

6万+: 访问

: 等级

716: 积分

11: 粉丝

12: 获赞

11: 评论

45: 收藏

私信

关注

热门文章

分类专栏

安卓 5篇
APP 20篇
RN 22篇
IOS 2篇
前端 3篇
js 6篇
es6 1篇
兼容 2篇
小程序 1篇
taro 1篇
fabric 1篇
java 3篇
vue 12篇
html 10篇

最新评论

[Android]自定义打包生成文件的名字
Sca_jie: 大佬你好，我复制代码过去，直接提示【将 lambda 表达式返回值类型更改为Unit】，查了好久都没有找到解决方案，如果你知道怎么解决，麻烦回复我一下，谢谢！
[RN]实现在系统播放器上控制app内的媒体播放
秘小乐: react-native-track-player可以同时进行两个播放器的播放吗
[RN]用webview展示Vue单页面应用，跳转页面时，安卓不触发onNavigationStateChange方法
羽Orz: 6.4.1版本之前安卓这边的onMessage只会返回data，没有先调用createWebViewEvent [code=java] public void onMessage(String message) { dispatchEvent(this, new TopMessageEvent(this.getId(), message)); } [/code] [code=java] override fun dispatch(rctEventEmitter: RCTEventEmitter) { val data = Arguments.createMap() data.putString("data", mData) rctEventEmitter.receiveEvent(viewTag, EVENT_NAME, data) } [/code]
[RN]用webview展示Vue单页面应用，跳转页面时，安卓不触发onNavigationStateChange方法
羽Orz: 安卓源码 onMessage方法中的 WritableMap data = mRNCWebViewClient.createWebViewEvent(webView, webView.getUrl()); [code=java] public void onMessage(String message) { if (mRNCWebViewClient != null) { WebView webView = this; webView.post(new Runnable() { @Override public void run() { WritableMap data = mRNCWebViewClient.createWebViewEvent(webView, webView.getUrl()); data.putString("data", message); dispatchEvent(webView, new TopMessageEvent(webView.getId(), data)); } }); } else { WritableMap eventData = Arguments.createMap(); eventData.putString("data", message); dispatchEvent(this, new TopMessageEvent(this.getId(), eventData)); } } [/code]
[RN]用webview展示Vue单页面应用，跳转页面时，安卓不触发onNavigationStateChange方法
羽Orz: 关于方法二，需要补充一下，只适合react-native-webview 6.4.1版本及以后 6.4.1版本之前安卓这边的postMessage方法并不会在onMessage中的方法注入canGoBack等参数 [code=java] protected WritableMap createWebViewEvent(WebView webView, String url) { WritableMap event = Arguments.createMap(); event.putDouble("target", webView.getId()); // Don't use webView.getUrl() here, the URL isn't updated to the new value yet in callbacks // like onPageFinished event.putString("url", url); event.putBoolean("loading", !mLastLoadFailed && webView.getProgress() != 100); event.putString("title", webView.getTitle()); event.putBoolean("canGoBack", webView.canGoBack()); event.putBoolean("canGoForward", webView.canGoForward()); return event; } [/code]

您愿意向朋友推荐“博客详情页”吗？

强烈不推荐
不推荐
一般般
推荐
强烈推荐

提交

最新文章

目录

评论 1

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。