React Native应用安卓端导航时因WebView导致崩溃问题求助

• 1. 导航reset参数配置错误：你定义的resetAction中index设为1，但routes数组仅包含1个路由元素，路由索引从0开始计数，参数越界会直接触发导航逻辑崩溃。
• 2. 导航栈条件渲染和导航操作时序冲突：你的根导航栈是基于rootStore.auth.loggedin状态条件渲染的，登录成功更新该状态后，authStack会被立即卸载，此时调用auth页面上下文的navigation.dispatch，会因为导航上下文已经销毁触发崩溃。
• 3. WebView安卓端卸载残留冲突：WebView页面返回后未主动销毁WebView实例，安卓原生层的WebView资源残留会和后续导航切换的渲染逻辑冲突，叠加触发崩溃。

1. 修正reset导航参数（如果保留手动导航逻辑） #

将resetAction的index调整为和routes数组长度匹配的有效值：

const resetAction = CommonActions.reset({
  index: 0, // 原index=1参数越界，修改为0
  routes: [{ name: 'primaryStack' }]
})

2. 优化导航逻辑避免上下文失效 #

你当前用了状态驱动的条件导航栈，登录成功后无需手动调用导航跳转：

• 直接删除login函数中navigation.dispatch(resetAction)这行代码，只要更新rootStore.auth.loggedin为true，导航会自动切换到primaryStack，不会出现上下文销毁的问题。
• 如果要保留手动导航的写法，不要用条件渲染根导航栈的方案，把authStack和primaryStack都声明为Stack的固定屏幕，登录成功后再执行reset操作即可。

3. 修复WebView资源残留问题 #

给WebView添加销毁逻辑，避免安卓端内存残留：

import { useRef, useEffect } from 'react'

// WebView页面内代码
const webViewRef = useRef(null)
useEffect(() => {
  return () => {
    // 页面卸载时主动销毁WebView
    webViewRef.current?.clearCache(true)
    webViewRef.current?.destroy()
  }
}, [])

// WebView标签绑定ref
<WebView
  ref={webViewRef}
  source={{ uri: 'http://192.168.1.6:8000/admin' }}
  // 无特殊需求可以删除androidHardwareAccelerationDisabled属性，降低渲染冲突概率
  // androidHardwareAccelerationDisabled
  startInLoadingState={true}
  renderLoading={() => 
    <Text style={[P,{color:color.palette.blue,alignSelf:"center",}]}
    numberOfLines={1} ellipsizeMode="tail">
      Loading…
    </Text>
  }
/>

先完成前两步修改测试崩溃是否复现，如仍有崩溃再添加WebView的销毁逻辑即可解决问题。

内容的提问来源于stack exchange，提问作者Hakeem.D