인프런 커뮤니티 질문&답변

ajrfyd님의 프로필 이미지

작성한 질문수

맛집 지도앱 만들기 (React Native + NestJS)

[7-0] 캘린더 구현하기(1) - 월 변경하기

랜더링 질문 있습니다!!

해결된 질문

24.06.07 00:26 작성

·

157

1

  • 발생: FeedDetailScreen

  • 진도: Calendar 구현하기 도입

  • 내용: Rendered more hooks than during the previous render

     

    v
    
       Previous render            Next render
       ------------------------------------------------------
    1. useContext                 useContext
    2. useContext                 useContext
    3. useContext                 useContext
    4. useEffect                  useEffect
    5. useState                   useState
    ....
    29. undefined                 useEffect
       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    
    in FeedDetailScreen (created by SceneView)

    useEffect의 위치에 따라 저런 에러가 발생하는데 왜 그런지 혹시 알 수 있을까요??


    const { id } = route.params;
    ...
    const { } = useHooks;
    
    //! useEffect <<<<< 에러 발생 x
      if (isError || isPending) return null;
    //! 아래로 에러 발생
    
    //! useEffec <<<< 에러 발생
    
    handler 1
    handler 2
    
    return (View)

     

답변 2

0

ajrfyd님의 프로필 이미지
ajrfyd
질문자

2024. 06. 08. 22:41

if (isError || isPending) return null;

이 아래에 정의되어 있는 핸들러 들이나 함수등등이

조건부로 생성이 될 수 도 있고 안될 수도 있는 것인가요??

 

그런 이유로 저런 early return?? 은 최 하단에

위치하는게 좋을까요??

0

Kyo님의 프로필 이미지
Kyo
지식공유자

2024. 06. 07. 15:47

메세지를 보면 이전렌더링보다 더많은 훅을 렌더링했다고 하는데요

동일한 순서로 훅이 호출되는것이 보장되지 않아서 발생한 문제입니다.

조건에따라 훅을 호출하거나 반복문에서 호출하는 등의 문제로 발생합니다

ajrfyd님의 프로필 이미지

작성한 질문수

질문하기