[PROJECT-JULABO-React] Uncaught TypeError: Cannot read properties of undefined (reading '0')

配列として受信したpropsからインデックスにアクセスしようとしたとき、次のエラーが発生しました.
Uncaught TypeError: Cannot read properties of undefined (reading '0')
非配列変数にインデックスでアクセスしようとすると、上記のエラーが発生します.
親コンポーネントから撮影しても、子コンポーネントから撮影しても、配列の値がインデックスの範囲を明らかに超えていると判断すると、エラーが発生します.

しかし、undefinedタグがあるのを見たとき、私がアクセスするインデックスがundefinedであれば、間違いが起こるに違いないと思います.
undefinedが発生したのは、最初のマウント時に親コンポーネントが非同期で処理されているため、undefinedに入り、非同期処理が完了してから値を正しく入力したが、最初のマウント時に値を受信してアクセスしようとしたため、エラーが発生したためです.
したがって,ユーザEffect部分に条件文を与えて検証した後,値を与えることで問題が解決する.

useEffect(() => {
    setImgArr(productInfo.imageUrls);
    if (productInfo.imageUrls) {
      console.log(productInfo.imageUrls[0]);
    }
}, [setImgArr, productInfo.imageUrls]);

今後、受信したデータが非同期で受信したデータを処理している場合は、これらのデータを検証する習慣を身につける必要があります.