React Native自定义Hook返回状态为undefined的问题求助

自定义Hook useGpsLocation 返回的 gpsLocation、timeZone 状态值在调用 requestLocationPermissions 后立即访问时为 undefined，但Hook内部日志显示状态已正确设置。具体场景是在 UserProvider 中调用该方法后，尝试将这些值用于数据库写入，结果均为 undefined。

核心原因 #

getLocation 函数标记为 async，但内部调用的 Geolocation.getCurrentPosition 是基于回调的异步API，并非Promise，导致 await getLocation() 不会等待定位完成就直接执行后续代码。此时组件还未完成状态更新，读取到的仍是初始的 null 或空字符串。

解决方案 #

1. 改造 getLocation 为Promise风格 #

将基于回调的定位API包装成Promise，让 await 能真正等待定位操作完成：

修改 useGpsLocation 中的 getLocation 函数：

const getLocation = () => {
  return new Promise<{ gpsLocation: Location, timeZone: string }>((resolve, reject) => {
    Geolocation.getCurrentPosition(
      position => {
        const { latitude, longitude } = position.coords;
        setShowInputs(true);
        const latLngToCell = h3.latLngToCell(latitude, longitude, 6);
        const location = h3.cellToLatLng(latLngToCell);
        const timezone = moment.tz.guess();
        const gpsLoc = { lat: location[0], lng: location[1] };
        
        setTimeZone(timezone);
        setGpsLocation(gpsLoc);
        resolve({ gpsLocation: gpsLoc, timeZone: timezone });
      },
      error => {
        console.log("The location could not be loaded because ", error.message);
        reject(error);
      },
      { enableHighAccuracy: false, timeout: 20000 }
    );
  });
};

2. 修改 requestLocationPermissions 返回定位数据 #

让权限请求方法直接返回定位结果，避免依赖组件状态的异步更新：

const requestLocationPermissions = async () => {
  try {
    const granted = await PermissionsAndroid.request(
      PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
      {
        title: 'Allow Location',
        message:
          'Do you accept that you are sharing your location ' +
          'We dont use your specific location',
        buttonNegative: 'Cancel',
        buttonPositive: 'OK',
      },
    );
    if (granted === PermissionsAndroid.RESULTS.GRANTED) {
      return await getLocation();
    } else {
      setError('Location permission denied');
      throw new Error('Location permission denied');
    }
  } catch (err) {
    console.warn(err);
    throw err;
  }
};

3. 更新 UserProvider 中的调用逻辑 #

直接从 requestLocationPermissions 的返回值中获取数据，无需依赖Hook状态：

// 替换原有的await requestLocationPermissions();
const { gpsLocation, timeZone } = await requestLocationPermissions();
const latitude = gpsLocation.lat;
const longtitude = gpsLocation.lng;
const tz_name = timeZone;

console.log(latitude + " " + longtitude + tz_name);

// 后续activateAccount等逻辑保持不变

4. 异常处理增强 #

确保在权限拒绝或定位失败时，错误能被正确捕获并处理，避免后续逻辑无意义执行。

内容的提问来源于stack exchange，提问作者Nick