match

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

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

버젼이 바뀌면서 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"

라는 오류가 발생합니다ㅠ

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