为React Native地图组件设置加载超时，加载默认坐标

针对你遇到的「未授权位置权限/无法获取位置时Loading持续显示」的问题，可以通过超时机制+错误场景兜底来解决，核心是确保无论定位成功与否，Loading都会在指定时间内关闭并加载默认坐标。

解决方案步骤 #

1. 定义默认坐标

在Map组件顶部添加兜底的默认区域（可根据业务需求修改坐标）：

// 示例：北京天安门坐标，替换为你的默认位置
const DEFAULT_REGION = {
  latitude: 39.9042,
  longitude: 116.4074,
  latitudeDelta: 0.01,
  longitudeDelta: 0.01,
};

2. 重构位置获取逻辑（加入超时与错误处理）

修改useEffect中的定位逻辑，覆盖权限拒绝、定位失败、超时三种场景：

useEffect(() => {
  // 设置全局超时：5秒后强制关闭Loading并加载默认坐标
  const timeoutId = setTimeout(() => {
    if (loading) {
      setRegion(DEFAULT_REGION);
      setLoading(false);
    }
  }, 5000); // 超时时间可自定义，比如5000ms=5秒

  const fetchUserLocation = async () => {
    try {
      // 请求位置权限
      const { status } = await Location.requestForegroundPermissionsAsync();
      if (status !== 'granted') {
        // 权限拒绝：直接用默认坐标关闭Loading
        setRegion(DEFAULT_REGION);
        setLoading(false);
        return;
      }

      // 获取用户位置，同时设置自身超时（比全局超时短1秒，优先触发本地失败）
      const location = await Location.getCurrentPositionAsync({
        timeout: 4000,
        maximumAge: 0, // 不使用缓存位置
      });

      // 定位成功：更新用户位置与地图区域
      if (location?.coords) {
        setUserLocation(location);
        setRegion({
          latitude: location.coords.latitude,
          longitude: location.coords.longitude,
          latitudeDelta: 0.01,
          longitudeDelta: 0.01,
        });
      } else {
        // 位置数据异常：用默认坐标兜底
        setRegion(DEFAULT_REGION);
      }
      setLoading(false);
    } catch (error) {
      // 定位失败（如定位服务未开启、网络异常）：用默认坐标
      console.error('获取位置失败:', error);
      setRegion(DEFAULT_REGION);
      setLoading(false);
    }
  };

  fetchUserLocation();

  // 组件卸载时清除定时器，避免内存泄漏
  return () => clearTimeout(timeoutId);
}, []);

3. 优化地图显示判断

原代码开头的if (!(region || franchises.length)) return null;可能导致地图无法正常显示，调整为：

// 只要有门店数据或地图区域（含默认），就渲染地图
if (!franchises.length && !region) return null;

核心优化点说明 #

• 全局超时兜底：确保极端场景下Loading不会无限挂起
• 权限拒绝主动处理：不再默默return，直接切换到默认坐标
• 定位错误捕获：覆盖定位服务未开启、网络问题等所有失败场景
• 定时器清理：组件卸载时清除定时器，避免内存泄漏

内容的提问来源于stack exchange，提问作者Alfonso.b