Frontend/SolidJS

[Solid] 페이지 라우팅 설정하기

Rayi 2025. 2. 8. 02:46

Solid-MetaSolid-Router를 사용합니다.

App.tsx

import Pages from './pages';

const App: Component = () => {
  return (
    <MetaProvider>
    <Router>
      <Route>
        <Pages/>
      </Route>
    </Router>
    </MetaProvider>
  );
};

/Pages/index.tsx

const Pages = () => {
  return (
    <>
        <Route path="/" component={MainPage} />
        <Route path="/path1" component={path1Page} />
        <Route path="/path2" component={path2Page} />
        {/* ... */}
    </>
  )
}

export default Pages

index.tsx 파일이 있다면 다른 곳에서 Pages 폴더만 호출해도 index.tsx가 기본 파일로 호출되기 때문에,

 

Pages 컴포넌트를 불러올 수 있습니다.

728x90