检索 Promise 中的值

Question

我有这样的方法，我想填充teamMems数组。我做错了什么！

takeTeamMembers(client:any, teamIds:string[], projectId:string){
        
    var teamMems :TeamMember[] = []
    teamIds.forEach((teamId:string) =>{
        client.getTeamMembersWithExtendedProperties(projectId, teamId, undefined, undefined).then(
            function(items:any){
                items.map((curr:any) => {
                    if(teamMems.filter((item:TeamMember) => {return item.memberId == curr.identity.id}).length == 0){
                        teamMems= [...teamMems, {teamIds: [teamId], memberId:curr.identity.id, name:curr.identity.displayName}]
                    }
                    else{
                        teamMems.filter((item:TeamMember)=> item.memberId == curr.identity.id)[0].teamIds.push(teamId);
                    }
                })
                console.log("1 return innermems", teamMems)
            });
            console.log("2 return ", teamMems)
        })
        console.log("before return ", teamMems)
        return teamMems;
}

控制台输出为

Answer 1

您的异步调用需要先等待 returns。像这样...

takeTeamMembers(client:any, teamIds:string[], projectId:string){
        
    var teamMems :TeamMember[] = []
    var innerMems : TeamMember[] = []

    // make function callback async here

    teamIds.forEach(async (teamId:string) => {
        // then await this function here
        await client.getTeamMembersWithExtendedProperties(projectId, teamId, undefined, undefined).then(
            function(items:any){
                items.map((curr:any) => {
                    if(innerMems.filter((item:TeamMember) => {return item.memberId == curr.identity.id}).length == 0){
                        innerMems = [...innerMems, {teamIds: [teamId], memberId:curr.identity.id, name:curr.identity.displayName}]
                    }
                    else{
                        innerMems.filter((item:TeamMember)=> item.memberId == curr.identity.id)[0].teamIds.push(teamId);
                    }
                })
                teamMems = teamMems.concat(innerMems)
                console.log("1 return innermems ", teamMems)
            });
            console.log("2 return ", teamMems)
        })
        console.log("before return ", teamMems)
        return teamMems;
}

编辑 2：

修复了这个调用

async function takeTeamMembers(client:any, teamIds:string[], projectId:string){

    let teamMems :TeamMember[] = []
    let innerMems : TeamMember[] = []

    // remember to await the map call also
    await Promise.all(await teamIds.map(async (teamId:string) => {
        await client.getTeamMembersWithExtendedProperties(projectId, teamId, undefined, undefined).then(
            (items:any) => {
                items.map((curr:any) => {
                    if(innerMems.filter((item:any) => {return item.memberId == curr.identity.id}).length == 0){
                        innerMems = [...innerMems, {teamIds: [teamId], memberId:curr.identity.id, name:curr.identity.displayName}]
                    }
                    else{
                        innerMems.filter((item:any)=> item.memberId == curr.identity.id)[0].teamIds.push(teamId);
                    }
                })
                teamMems = teamMems.concat(innerMems);
            });
    }));

    return teamMems;
}

Answer 2

我认为使用这样的 async 功能你会玩得更开心。这个想法是使用 Promise.all() 首先等待所有 getTeamMembersWithExtendedProperties 调用，然后只处理平面的常规数组。

// dummy implementation to ensure types are correct, replace with your actual stuff
async function getTeamMembersWithExtendedProperties(projectId: string, teamId: string) {
  return ["something"];
}

async function takeTeamMembers(client: any, teamIds: string[], projectId: string) {
  const teamsAndMembers = await Promise.all(
    teamIds.map(async (teamId) => ({
      teamId,
      members: await getTeamMembersWithExtendedProperties(projectId, teamId),
    })),
  );
  const teamMems = [];
  const innerMems = [];
  teamsAndMembers.forEach(({ teamId, members }) => {
    // Do the innerMems/teamMems logic here...
  });
  return teamMems;
}

检索 Promise 中的值

To retrieve a value in a Promise

promise

typescript

reactjs

es6-promise