React Native Maps 中 Android 崩溃问题分析与解决方案

问题背景

在使用 React Native Maps（版本 1.7.1）与 Expo SDK 49 集成的 Android 应用中，开发者遇到了随机崩溃问题。崩溃日志显示为 IllegalStateException，错误信息为"Can't take a snapshot while executing in the background"。

问题分析

这个崩溃问题源于 Google Maps Android API 的内部机制。当应用尝试在后台执行时对地图进行快照操作，系统会抛出此异常。这种情况通常发生在以下场景：

1. 应用进入后台但地图组件仍在尝试执行某些操作
2. 组件卸载时仍有未完成的地图操作
3. 快速切换应用状态导致地图状态不一致

在开发者提供的代码中，特别值得注意的是使用了 setTimeout 来延迟显示标记的呼出框(Callout)。这种异步操作可能在组件已经卸载或应用进入后台时仍然执行，从而触发此异常。

解决方案

1. 优化组件生命周期管理

建议使用 React 的状态和副作用钩子来替代 setTimeout，这样可以更好地与组件生命周期同步：

useEffect(() => {
  if (mapReady && defaultMarker.current) {
    defaultMarker.current.showCallout();
  }
}, [mapReady]);

2. 添加应用状态检查

在可能触发地图操作的代码前，检查应用是否处于活动状态：

import { AppState } from 'react-native';

// 在操作前检查
if (AppState.currentState === 'active') {
  // 执行地图操作
}

3. 简化地图交互逻辑

检查并简化地图上的多点触控逻辑。在示例代码中，MapView 和 Callout 组件都设置了相同的 onPress 处理程序，这可能导致事件冲突。

4. 升级依赖版本

考虑升级 React Native Maps 到最新版本，因为新版本可能已经包含了针对此类问题的修复。同时确保 Expo SDK 也更新到兼容版本。

最佳实践建议

1. 避免直接操作 ref：尽量减少直接通过 ref 调用组件方法，而是通过状态驱动 UI 变化
2. 优雅处理组件卸载：在 useEffect 清理函数中取消所有未完成的操作
3. 性能优化：对于简单的地图展示，可以关闭不必要的功能如旋转、倾斜等
4. 错误边界：在地图组件周围添加错误边界，捕获并处理可能的崩溃

结论

这类地图相关的崩溃问题通常需要从组件生命周期管理和应用状态监测两方面入手解决。通过采用 React 的声明式编程模式替代命令式操作，可以显著提高应用的稳定性。同时，保持依赖库的及时更新也是预防已知问题的有效手段。

对于无法立即升级的项目，实现应用状态检查和操作前的条件验证是最快速有效的临时解决方案。长期来看，重构地图交互逻辑以更好地遵循 React 的设计哲学将带来更稳定的用户体验。