如何修复封装.then回调的JS异步函数提前返回值问题(react-native-permissions)
解决异步函数跳过回调直接返回的问题
你的代码问题出在async函数里没有等待checkMultiple的异步操作完成,直接走到了末尾的return 'why'。另外函数声明返回boolean,但最后返回字符串,类型也不匹配。
修正方案:用await替代.then
既然已经用了async函数,就应该搭配await来处理异步操作,这样能保证函数等待异步结果返回后再执行后续逻辑,而不是直接跳过。
修正后的代码如下:
import { PERMISSIONS, RESULTS, checkMultiple } from 'react-native-permissions'; import { Platform } from 'react-native'; const checkPermissions = async (): Promise<boolean> => { console.log('Platform.OS', Platform.OS); if (Platform.OS === 'ios') { const status = await checkMultiple([ PERMISSIONS.IOS.LOCATION_ALWAYS, PERMISSIONS.IOS.MOTION, ]); const allGranted = status[PERMISSIONS.IOS.LOCATION_ALWAYS] === RESULTS.GRANTED && status[PERMISSIONS.IOS.MOTION] === RESULTS.GRANTED; console.log(allGranted ? 'permissions allgood' : 'PERMISSIONS are false.'); return allGranted; } else if (Platform.OS === 'android') { const status = await checkMultiple([ PERMISSIONS.ANDROID.ACCESS_BACKGROUND_LOCATION, PERMISSIONS.ANDROID.ACTIVITY_RECOGNITION, ]); const allGranted = String(status[PERMISSIONS.ANDROID.ACCESS_BACKGROUND_LOCATION]) === RESULTS.GRANTED && String(status[PERMISSIONS.ANDROID.ACTIVITY_RECOGNITION]) === RESULTS.GRANTED; console.log(allGranted ? 'permissions allgood' : 'PERMISSIONS are false.'); return allGranted; } // 处理其他平台(比如web)的情况,默认返回false或者根据需求调整 return false; }; // 调用的时候需要用await或者.then获取结果 // 方式1:在async函数里用await const getPermissionsStatus = async () => { const permissionsOn = await checkPermissions(); console.log('permissionsOn', permissionsOn); }; getPermissionsStatus(); // 方式2:用.then回调 checkPermissions().then(permissionsOn => { console.log('permissionsOn', permissionsOn); });
关键修改点:
- 把
.then回调改成await获取checkMultiple的结果,让async函数等待异步操作完成后再返回结果。 - 函数返回类型明确为
Promise<boolean>(async函数本身返回Promise,TypeScript会自动推断,也可以省略该声明)。 - 移除错误的
return 'why',替换为对应平台的权限判断结果,同时补充了其他平台的默认返回逻辑。 - 调用函数时必须用
await或.then获取异步结果,直接打印checkPermissions()会输出Promise对象,无法拿到实际布尔值。
内容的提问来源于stack exchange,提问作者dark stack
相关产品推荐
相关产品推荐

