강의

멘토링

로드맵

Cộng đồng Hỏi & Đáp của Inflearn

Hình ảnh hồ sơ của ohjaehokor4592
ohjaehokor4592

câu hỏi đã được viết

Lập trình React thực tế

Tạo một ứng dụng một trang (SPA)

match

Đã giải quyết

Viết

·

494

1

안녕하세요~ 코린이입니다.

제가 코드를 그대로 따라하며 공부중인데

버젼이 바뀌면서 route를 쓰는 방식이  변한것같은데

component가 element로 바뀌었나요??

그리고 혹시 match.url은 버젼이 바뀌면서 사라진건가요??

올려주신 코드를 복붙하니 오류가 나오네요ㅠ

 

혹시 그렇다면

<Route path={`${match.url}/:roomId`} component={Room} />은

현재 어떻게 써야될까요??

useParams를 써서 해야되나요??

 

```

import React from "react";
import { Route, Link, Routes } from "react-router-dom";

export default function Rooms() {
  return (
    <div>
      <h2>여기는 방을 소개하는 페이지입니다.</h2>
      <Link to="bludRoom">파란 방입니다</Link>
      <br />
      <Link to="greenRoom">초록 방입니다</Link>
      <br />
      <Routes>
        <Route exact path="rooms" render={() => <h3>방을 선택해 주세요.</h3>} />
        <Route path="/:roomId" element={<Room />} />
      </Routes>
    </div>
  );
}

function Room() {
  return <h2>{` 방을 선택하셨습니다.`}</h2>;
}

 

```

 

 

이것저것 수정해가며 시도하고있는데 여기서 막혔네요 ㅠㅠ

다른 페이지는 작동하는데

http://localhost:3000/rooms/bludRoom 처럼 :roomId로 처리하려고 했던 페이지가

No routes matched location "/rooms/bludRoom"

라는 오류가 발생합니다ㅠ

 

reactredux

Câu trả lời 1

1

landvibe님의 프로필 이미지
landvibe
Người chia sẻ kiến thức

안녕하세요
react-router-dom 버전이 올라가면서 사용법이 많이 변경됐네요
가장 큰 변경은 상대경로를 사용하는 방식인 것 같습니다

최신 버전에 맞춰서 코드를 다시 작성했으니 아래 링크 참고하세요~!
코드 링크

ohjaehokor님의 프로필 이미지
ohjaehokor
Người đặt câu hỏi

감사합니다 !!

Hình ảnh hồ sơ của ohjaehokor4592
ohjaehokor4592

câu hỏi đã được viết

Đặt câu hỏi