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

khhan1990님의 프로필 이미지

작성한 질문수

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

Link 적용하기

컴포넌트 넘어가지 않는 문제

작성

·

456

2

강사님 안녕하세요.

질문란에 다른 분들이 많이 질문하신 것 같지만
대부분은 path를 /products/:id가 아닌 /product로 하셔서 그런 경우가 많은 것 같습니다.

제 경우에는 products/:id로 했음에도 불구하고 
아이템을 클릭했을 시 url만 변경되며 컴포넌트는 변경되지 않고, 새로고침을 하면 그제서야 넘어가는 문제가 발생하여 구글링을 통해 여러가지를 시도해봤지만 되지 않다가 index.js에서 아래와 같이 <React.StrictMode>를 지우니 해결이 되었습니다.
이 해결방법 찾는데만 거의 2시간이 걸렸던 것 같네요..ㅠㅠ

const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(
  <React.StrictMode> => 삭제
    <BrowserRouter>
      <App />
    </BrowserRouter>
  </React.StrictMode>=> 삭제
);

아래 리액트 공홈에서 Strict에 대하여 읽어보기는 했지만 사실 100% 이해하기는 조금 어려운 것 같습니다.

https://ko.reactjs.org/docs/strict-mode.html

npx 혹은 npm을 통해 리액트를 생성하면 자동으로 Strict모드로 설정된다고 하는데, 왜 이 Strict모드가 설정이 되면 url만 변경되고 컴포넌트는 바로 변경되지 않는 문제가 발생하는 건가요?

그리고 Strict모드는 개발 환경에서만 작동하고 실제 배포하면 저절로 작동하지 않는다는데, 개발과정에 Strict 모드를 없앤 상태로 진행해도 괜찮을까요?

답변 2

0

안녕하세요
혹시 해당 문제에 대한 답변을 받으셨을까요?

0

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

안녕하세요

Strict 모드는 일반적으로 경고를 제공해주는 기능이고 실제로 라우팅에 영향을 주는 것은 아닌 것으로 알고 있습니다!

github repo를 공유해주시면 제가 한 번 확인해볼 수 있을 것 같아요 :)

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

넵 github에 올라가 있는 코드는 <React.StrtictMode>가 삭제된 상태입니다.

제 github 주소 공유 드립니다 감사합니다!

https://github.com/Kyu-holic/grab-market-web-main.git

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

엇 비공개로 뜨는 것 같습니다 ㅠㅠ

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

헐 private로 만든지 몰랐네요..!! 

public으로 변경했습니다!

https://github.com/Kyu-holic/grab-market-web-main.git

다시 확인해 주시면 감사드리겠습니다!

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

현재 다시 확인봤을 때 Strict Mode의 유무에 상관없이 라우팅이 잘 되는 것 같습니다..

문제가 생기는 상황에서 콘솔 로그를 공유해주실 수 있을까요?