等待地图内的所有异步函数完成执行答案

【问题标题】：Wait all async function inside map to finish execution等待地图内的所有异步函数完成执行
【发布时间】：2020-09-13 03:38:56
【问题描述】：

我想在地图中完成 ALL 异步函数的执行，然后更改我的组件的状态。如果你能帮助我，我给你留下了一小部分代码。

我要做的就是在每次用户取消它时显示我自己的权限屏幕。

为了简化，我有这个：

const permissions = {
    cameraRoll: {
        iconType: "ionicon",
        iconName: "ios-images",
        title: "Enable camera roll",
        subtitle:
          "To upload content from your Gallery, you have to granted the camera roll permission",
        buttonText: "Enable camera roll",
        checkPermission: checkCameraRollPermission,
        requirePermission: requireCameraRollPermission,
      },
    };
}


const checkCameraRollPermission = async () => {
    const { status, canAskAgain } = await Permissions.getAsync(
      Permissions.CAMERA_ROLL
    );
    return { status, canAskAgain };
  };


  const requireCameraRollPermission = async () => {
    const { status, canAskAgain } = await Permissions.askAsync(
      Permissions.CAMERA_ROLL
    );
    return { status, canAskAgain };
  };


/* I HAVE TO WAIT FOR ALL THE FUNCTIONS TO FINISH EXECUTION
FOR EACH OBJECT ON THE MAP BUT THIS IS NOT WORKING :( */
getMissingPermissions = () => {
    // Only check permissions on the foreground
    if (AppState.currentState.match(/active/)) {
      // We have to empty the current missing permssions and recalculate them
      const permissionsArray = [];
      Promise.all(
        Object.keys(permissions).map((key) => {
          permissions[key].checkPermission().then(({ status }) => {
            if (status !== "granted") {
              permissionsArray.push(permissions[key]);
            }
          });
        })
      ).then(() => {

        this.setState({
          missingPermissions: permissionsArray,
        });
      });
    }
  };

有什么想法吗？谢谢

【问题讨论】：

.map() 的回调应该是 return 一个值
现在你的permissions 对象只有一个请求的权限。最终会有不止一个吗？如果没有，那么您甚至不需要映射权限调用。
是的，它有更多，它被简化了

标签： javascript reactjs react-native async-await react-redux

【解决方案1】：

使用Promise.all，您需要将承诺作为数组提供。目前，您没有从导致问题的地图中返回任何内容。

除了使用 permissionsArray 变量，您还可以简单地从嵌套的 Promise 中返回所需的值，这将在 Promise.all(...).then(...) 响应中提供

getMissingPermissions = () => {
    // Only check permissions on the foreground
    if (AppState.currentState.match(/active/)) {
      // We have to empty the current missing permssions and recalculate them
      Promise.all(
        Object.keys(permissions).map((key) => {
          return permissions[key].checkPermission().then(({ status }) => {
            if (status !== "granted") {
              return permissions[key];
            }
            return;
          });
        })
      ).then((res) => {
        const permissionsArray = res.filter(Boolean)// Filter out undefined values
        this.setState({
          missingPermissions: permissionsArray,
        });
      });
    }
  };

【讨论】：