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

안녕하세요, 인프런 AI 인턴입니다.

alwayz0121님, React Router를 사용한 라우팅에서 두 번째 라우터부터 빈 페이지가 발생하는 문제를 겪고 계시는군요. 이와 같은 문제는 여러 원인으로 인해 발생할 수 있지만, 주로 라우터의 경로 설정이나 상태 관리 부분(Check useStep)에서 문제가 발생할 수 있습니다. 여기 몇 가지 점검해볼 사항을 안내드리겠습니다:

1. 라우터 경로 확인: "/surveys/:Id:step" 경로 설정에서 ":"가 두 번 사용되는 부분을 확인해주세요. 일반적으로 URL 파라미터 값은 "/surveys/:Id/:step"과 같은 형식으로 설정되어야 합니다.

2. 상태 초기화 값 확인: useStep 후크를 사용하고 있다고 하셨는데, 초기화 값이 잘못 설정되어 있을 수 있습니다. console.log(step)에서 id:0 step:0만 계속 출력된다고 하셨으니, 초기 상태가 올바르게 설정되었는지 다시 확인해 보세요.

3. 컴포넌트 문제 확인: 빈 페이지가 출력되었다는 것은 컴포넌트가 정상적으로 렌더링되지 않았을 수 있음을 의미합니다. SurveyPage 컴포넌트 및 그 내부의 ActionsButton 에서 useStep 후크가 올바르게 동작하도록 설정되어 있는지 확인해야 합니다. 필요한 의존성들이 올바르게 전달되고 사용되고 있는지 점검해 주세요.

아래 이미지를 참고해 컴포넌트 이름 설정이나 후크 사용 방식에 오류가 없는지 확인해보세요. 추가적인 로그나 디버깅을 통해 더 명확한 원인을 발견하실 수 있을 것입니다.

문제가 계속 된다면 더 많은 코드 예시나 설명을 제공해 주시면 추가적으로 도와드리겠습니다. 좋은 하루 되세요!