inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

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

react-router-dom 설치하기

경로 이동이 안됍니다..

294

조은택

작성한 질문수 39

1

 

강의 내용 처럼 url주소로 이동해 봤는데 안돼네요. 뭐가 잘못 됬을까요> ㅜ

react 머신러닝 배워볼래요? react-native express tensorflow HTML/CSS javascript nodejs

답변 4

1

조은택

vscode를 껏다 키니깐 갑자기 되네요 ㅎㅎㅎ 답변 감사합니다 

0

그랩

다행입니다 :) ㅎㅎ

1

조은택

잘 이해가 안가서 코드로 알려줄 수 있을까요?.. 강의에 써진 코드를 그대로 따라 썻는데 안돼네요 ㅠ

이렇게 app 위에 browerROUTER로 감싸긴 햇는데 이게 아닌가요?..

import { BrowserRouter } from "react-router-dom"; // BrowserRouter가 부모 컴포먼트로써 감싸야 페이지 이동 가능

ReactDOM.render(
  <React.StrictMode>
  <BrowserRouter> 
    <App /> 
  </BrowserRouter> 
  </React.StrictMode>,
  document.getElementById('root')
);

1

그랩

react-router를 사용하기 위해선 Router 컴포넌트를 switch 컴포넌트 상위에 꼭 넣어주셔야 합니다!

0

그랩

div 태그를 넣으면 정상적으로 react router가 동작하지 않습니다 ㅠ

0

토빌

"Router 컴포넌트를 switch 컴포넌트 상위에 넣어주어야 한다."가 어떤 의미인지 여쭈어봐도 될까요? 저도 글쓴이님처럼 강사님의 코드를 그대로 작성하였는데,  You should not use <Switch> outside a <Router> 이라는 오류가 뜹니다ㅠㅠ

작성한 App.js의 코드는 다음과 같습니다.

import "./App.css";
import MainPageComponent from "./main/index.js";
import "./index.css";
import { Switch, Route } from "react-router-dom";
import UploadPage from "./upload";
import ProductionPage from "./product";

function App() {
  return (
    <div>
      <Switch>
        <Route exact={true} path="/">
          <MainPageComponent />
        </Route>
        <Route exact={true} path="/product">
          <ProductionPage />
        </Route>
        <Route exact={true} path="/upload">
          <UploadPage />
        </Route>
      </Switch>
    </div>
  );
}

export default App;

1

조은택

react 코드 입니다

그리고 또 저는 <div>를 넣으면 오류가 나서 대신 browserouter 넣으니 되더라고요. div로 했는데 왜 오류가 났는지도 알려 주세요 ㅠㅠ

[해결]그랩님 답변 주세요.

0

190

2

그랩님의 답변을 기다립니다/102강 전반적인 에러

0

163

2

[그랩님께]101강 안드로이드 에러들(Key prop)해결방법 궁금합니다.

0

139

2

[재질문][그랩님 답변 부탁드립니다]101강

0

162

2

[그랩님 답변 부탁드립니다]101강 Axios 에러와 502 Bad Gateway 질문

0

119

2

Ngrok 설치 후 forwarding Url 에러

0

145

2

[그랩님께,Ngrok 악성코드 인식 해결방법]질문 드립니다.

0

251

2

Ngrok 설치 후 forwarding Url로 연결 불가

0

157

1

그랩님,[꼭] 답변 부탁드립니다.

0

76

1

[꼭][[꼭] 그랩님, 답변 부탁드립니다], Failed to load resource: the server responded with a status of 404 (Not Found) 상품 상세 페이지 질문입니다.

0

162

1

6강/7강 수업

0

56

1

그랩님, 상품 상세 페이지 에러와 의문점 질문드립니다.

0

105

2

그랩님, 해결되지 않은 에러 메시지 [꼭] 답변 부탁 드립니다.

0

148

2

[재 질문]Cannot read properties of undefined (reading 'map') TypeError: Cannot read properties of undefined (reading 'map') 에러 해결 어떻게 하나요?

0

95

1

Cannot read properties of undefined (reading 'map') TypeError: Cannot read properties of undefined (reading 'map') 에러 해결 어떻게 하나요?

0

134

2

일반적인 css 꾸미기에서 width와 height의 값?

0

98

2

Windows에서의 업로드 후 홈화면 상품이미지 오류 해결방법

0

204

1

그랩마켓 웹화면 구현하기 -2 질문입니다.

0

127

1

react에 반영이 되지 않습니다.

0

250

1

터미널 npm install -g create-react-app 작성 후 오류

0

430

1

create-react-app my app 실행 시 에러

0

358

2

포스트맨 질문

0

105

1

<꼭 답변 부탁 드립니다>그랩선생님, [컴포넌트 사용하기] 강의에서 질문 있습니다.

0

269

2

그랩선생님, 질문 답변 부탁 드립니다.vscode에서 npm install -g create-react-app 입력 후 에러 입니다.

0

492

2