티스토리 뷰

728x90

처음 방식

getClubInfo 함수를 통해 Promise를 처리한 후, LenArray라는 배열에 해당 값을 추가하는 것을 목표로 하였다.
LenArray에 처리된 데이터가 들어가 있을 거라고 생각한 후 console로 출력한 결과 처리된 값이 아닌 Promise가 배열에 추가된 것을 확인했다..

기존의 코드

async function getClubInfo(i){
	await axios.get(`${baseUrl}/clubs/${clubIdList[i]}/concise_info`).then((resConciseInfo) =>{
        const DetailClubInfoOne = {
            id : i,
            CurNumPeople : resConciseInfo.data["body"]["current_number_of_people"],
            HashTag : resConciseInfo.data["body"]["hashtag"],
            MaxNumPeople : resConciseInfo.data["body"]["maximum_number_of_people"],
            Name : resConciseInfo.data["body"]["name"],
        }
        //console.log(DetailClubInfoOne)
        return DetailClubInfoOne
    })}
}
.
.
.
useEffect(()=> {
    //setdetailClubInfoList([]);
    let LenArray = Array.apply(null, Array(clubIdList.length)).map((v,i) => (i));
    console.log(detailClubInfoList)
    console.log("Start")
    Promise.all(
        LenArray.map((v, i) => {
            GetClubInfo(i)
        })
    )
    console.log("ENd")
    console.log("EndArray:" + result)
    //console.log(detailClubInfoList)
}, [detailFinish]);

LenArray 출력 결과

Array [
  Promise {
    "_U": 0,
    "_V": 1,
    "_W": undefined,
    "_X": null,
  },
  Promise {
    "_U": 0,
    "_V": 1,
    "_W": undefined,
    "_X": null,
  },
]

//LenArray의 console 출력 값

찾아본 결과, Promise.all에 있는 getClubInfo 함수가 Promise가 아닌, 객체를 반환해 주어서 생긴 오류였다.

(promise.all은 promise를 처리해야 한다. promise.all([promise1, promise2 ...])
그러나, 나는 promise.all([object1, object2...])처럼 promise가 아닌 값을 리턴했다.)

해결 방식

getClubInfo 함수가 처리하는 것이 아닌, Promise.all에서 직접 처리하게 함으로써 오류를 해결했다.

async function test(){
        let LenArray = Array.apply(null, Array(clubIdList.length)).map((v,i) => (i));
        console.log(detailClubInfoList)
        console.log("Start")
        let arr = await Promise.all(LenArray.map((v, i) => 
            axios.get(`${baseUrl}/clubs/${clubIdList[i]}/concise_info`).then((resConciseInfo) =>{
                const DetailClubInfoOne = {
                    id : i,
                    CurNumPeople : resConciseInfo.data["body"]["current_number_of_people"],
                    HashTag : resConciseInfo.data["body"]["hashtag"],
                    MaxNumPeople : resConciseInfo.data["body"]["maximum_number_of_people"],
                    Name : resConciseInfo.data["body"]["name"],
                }
                console.log(DetailClubInfoOne)
                return DetailClubInfoOne
            })
        ))}

 

댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2025/01   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
글 보관함