• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

react-router 6버전 질문입니다 !

22.06.14 06:13 작성 조회수 186

0

안녕하세요

먼저 바쁘신데 바보같은 질문글 올려 죄송합니다.

저는 강의(라우터 주소 설계 중반까지 강의를 들었습니다)를 보는 도중 children을 사용하다가 중첩라우터 사용을 시도를 하였는데요,

 

코드를 잘못쓴 덕분에 이런 웹페이지의 형태로 보이게 되었습니다. 

그래서 제로초님께서 올려주신 공지사항의 유튜브와 구글링을 참고하여 

layout>Workspace>index.js

//중략        
<Chats>
  <Routes>
     <Route path="/channel/:channel" element={<Channel />} />
      <Route path="/dm/:id" element={<DirectMessage />} />
   </Routes>
</Chats>
//중략

기존의 코드를

//중략        
<Chats>
  <Routes>
     <Route path="/:channel" element={<Channel />} />
      <Route path="/:id" element={<DirectMessage />} />
   </Routes>
</Chats>
//중략

이렇게 수정하였습니다

 

웹페이지를 확인해보니 정상적으로 돌아오긴 하였으나

제가 올바르게 수정했는지 아닌지 몰라 이렇게 질문글 올립니다.

 

그리고 로그아웃후 로그인을 하면 기존의 워크스페이스가 안뜨지만 새로고침을 누르면 기존의 워크스페이스들이 뜨는 버그?가

발생하게 되었습니다.

콘솔에 에러는 전혀 나지 않는 상황이고

제가 어느부분의 설정을 잘못했는지 파악하려 시도했지만 서버코드까지 살펴보아도

대체 어느부분을 놓치고있는지 감도 오지 않아서 코드부분을 올리지 못하였습니다..ㅠㅠ

저런 현상이 혹시 SWR옵션과 관련있을까요 ..? 😭

 

 

답변 1

답변을 작성해보세요.

0

애플리케이션 탭 말고 네트워크탭에서 워크스페이스 제대로 받아오는지 확인해보세요.

네트워크탭 확인결과 로그인 후 새로고침을 하지 않으면 workspaces의 내용을 받아오지 못하는 것 같습니다

혹시몰라 제 Workspace 폴더의 index.tsx 코드 첨부드립니다 

++ 해결되었습니다 !

원인은 Login폴더의 index.tsx에서

onSubmit에 axios post요청시 mutate(response.data, false)로 되어있었는데요,

mutate(response.data)로 바꾸니 최초 로그인시 workspaces값 까지 받아올 수 있었습니다.

네네 아니면 로그인 시 응답에서 워크스페이스까지 추가를 해줬어야 하는 것 같네요. 이 부분은 서버에서 수정해놔야겠습니다.