api 호출이 두번 안 되게 하는 방법?

Select 에서 option item을 선택하면 그에 맞는 데이터를 가져 오려 하고 있습니다.

useEffect을 이용해서 첫번째 데이터는 자동 선택 되고 onChange 되면 다시 api 호출이 되는 방식으로

이해하고 코드를 작성했습니다. 예를 들어

const transform2DropdownForm = list => {
  const result = list.map(data => ({
    key: data.post_series_record_id,
    value: data.post_series_record_id,
    text: `${data.test_date} (${data.name})`,
    name: data.name,
  }));
  return result;
};
useEffect(() => {
    if (postSeq.length > 0) {
      const transformed = transform2DropdownForm(postSeq);
      
      setExamSeqList(transformed);

      // 첫번째 회차 선택
      setSelectedExamSeq(transformed[0]);
    
     //  id에 맞는 데이터 가져온다
     getPostData({ post_series_record_id: transformed[0].value });
      
    }
   
  }, [postSeq]);

  function onChnagePostSeqDropdown(e, data) {
    
    setSelectedPostSeq({ value: data.value });
    
    getPostData({ post_series_record_id: data.value });
  }

요런 방식으로 작성 했는데 api 호출이 두번 되는 건 왜 그런건가요?

너무 허접한 질문이지만 부족한 부분 알려주시면 감사하겠습니다…ㅠㅠ

이 코드들에는 여러 함수들이(setSelectedPostSeq, getPostData 등) 어떤 함수인지 알수 없는상태라 어떤 상태인지 파악이 불가능하네요. 좀 더 자세한 설명과 코드를 올려주시면 답변을 찾는데 도움이 될겁니다. :slight_smile: