React Native android 8以上版本闪退踩坑笔记_ITKEY__react native 闪退

irpas 02-07 4145

背景

我的android的测试机版本是android 8，我使用React Native开发的应用，自己测试是正常的。iOS上也是正常的。但是一放到android8以上的版本本就出现了闪退的现象，让我非常的苦恼。

本文就简单的总结一下，给遇到相同情况的朋友避坑。

探索过程

探索过程是及其痛苦，代码一点点注释。最终找到了两种可以导致Android 8以上版本闪退的情况。

WebView隐藏导致闪退React Navigation 嵌套过多，从子叶跳转祖叶会导致闪退。

而且这两种基本是在Android8 以上版本中安卓中出现，在iOS上也不会出现闪退。

解决过程 WebView隐藏导致的闪退

解决办法有两种：

不要隐藏WebView，比如：设置成flex:0 只要WebView不显示在界面中就会导致闪退。我把WebView的宽高设置成很小的数值，比如：2 界面上只能看到一个小点，但是不会闪退了。延时加载WebView。其他组件先渲染，WebView组件延时渲染，也可以避免闪退。

代码示例如下：

const [showChart, setShowChart] = React.useState(false) React.useEffect(() => { setTimeout(() => { setShowChart(true); }, 100); }, []); <View style={{flex: 0}}> {showChart?<LoginWebView url={url} height={20} loginScript={loginScript} onLoginSuccess={handleLoginSuccess} onLayerMsg={handleLayerMsg} />:null} </View> React Navigation 嵌套过多，从子叶跳转祖叶会导致闪退。

解决办法：尽量减少嵌套，子叶跳转祖页有问题，那就尽量避免这种情况发现。

页面1 页面11 页面111页面112 页面2 页面21 页面211页面212

比如：子叶跳转祖叶会导致闪退

页面212 navigation.navigate(’页面11’) 会出现闪退。

解决办法就是尽量避免越级的调用，实在遇到调用，就在同级创建相同的页面，这样虽然麻烦，至少解决了闪退的问题。

比如：页面212 navigation.navigate(’页面211’) 这样同级调用就不会闪退。

我感觉这可能是某种BUG导致的，很难受啊。