[230621] React 라우터

1. 라우터 구성 작업 완료

• 하고 싶은 구성이 있는데 뜻대로 되지않아 시간이 오래 걸렸다.

//App
const App = () => {

  return (
    <>
      <Routes>
        {
        <Route path="/kindergarten/*" element={<Pages.KindergartenPage />} />
        <Route path="/*" element={<Pages.NotFoundPage />} />
      </Routes>
    </>
  );
};

export default App;

• 원했던 구성은 라우터 페이지 안에서 또 각자 페이지를 관리하는 라우터를 넣고 싶었다.

//Kindergarten
const KindergartenPage = () => {
  return (
    <>
      <Routes>
        <Route path="/" element={<Kindergarten />} />
        <Route path="/images" element={<ImagesPage />} />
        <Route path="/imageDetail" element={<ImageDetailPage />} />
      </Routes>
    </>
  );
};

export default KindergartenPage;

• 삽질의 결과 ,, kindergarten/ 라우터를 받고 들어왔으면 /images 해주면 결과적으론 kindergarten/images 라우터됨

• 계속 예외처리로 만들어둔 NotFoundPage 로 갔었는데 /kindergarten/* 이런식으로 라우터를 지정해야한다

movePage("/kindergarten/images");

• 불러줄때는 위와 같은 url 로 불러줘야함