From ddff738d2e8ed3a13bfca6c0be07e6c3371291e4 Mon Sep 17 00:00:00 2001 From: Patrick Alvin Alcala Date: Wed, 24 Sep 2025 17:55:40 +0800 Subject: [PATCH] Fixed layout and routing --- index.html | 2 +- index.tsx | 8 ++++++++ src/layouts/Layout.tsx | 35 +++++++++++------------------------ src/routers/router.tsx | 33 +++++++++++++++++++++++++++++++++ tsconfig.app.json | 2 +- 5 files changed, 54 insertions(+), 26 deletions(-) create mode 100644 index.tsx create mode 100644 src/routers/router.tsx diff --git a/index.html b/index.html index 79f7fef..f392686 100644 --- a/index.html +++ b/index.html @@ -18,6 +18,6 @@
- + diff --git a/index.tsx b/index.tsx new file mode 100644 index 0000000..b3b1273 --- /dev/null +++ b/index.tsx @@ -0,0 +1,8 @@ +import { render } from 'solid-js/web' +import { Router } from '@solidjs/router' + +import routes from './src/routers/router' + +const root = document.getElementById('root') + +render(() => {routes}, root!) diff --git a/src/layouts/Layout.tsx b/src/layouts/Layout.tsx index 46e82d0..68143a4 100644 --- a/src/layouts/Layout.tsx +++ b/src/layouts/Layout.tsx @@ -1,27 +1,14 @@ import './Layout.sass' -import { lazy } from 'solid-js' -import { render } from 'solid-js/web' -import { Router } from '@solidjs/router' +import type { JSXElement } from 'solid-js' -const root = document.getElementById('root') +interface Props { + children: JSXElement +} -const routes = [ - { - path: '/', - component: lazy(() => import('../pages/IndexPage/Index.tsx')), - }, - { - path: '/main', - component: lazy(() => import('../pages/MainPage/Main.tsx')), - }, - { - path: '/register', - component: lazy(() => import('../pages/RegisterPage/Register.tsx')), - }, - { - path: '/login', - component: lazy(() => import('../pages/LoginPage/Login.tsx')), - }, -] - -render(() => {routes}, root!) +export default (props: Props) => { + return ( + <> +
{props.children}
+ + ) +} diff --git a/src/routers/router.tsx b/src/routers/router.tsx new file mode 100644 index 0000000..4c1f7d1 --- /dev/null +++ b/src/routers/router.tsx @@ -0,0 +1,33 @@ +import { lazy } from 'solid-js' +import Layout from '../layouts/Layout.tsx' + +const routes = [ + { + path: '/', + component: (props: any) => {props.children}, + children: [ + { + path: '/', + component: lazy(() => import('../pages/IndexPage/Index.tsx')), + }, + { + path: '/main', + component: lazy(() => import('../pages/MainPage/Main.tsx')), + }, + { + path: '/register', + component: lazy(() => import('../pages/RegisterPage/Register.tsx')), + }, + { + path: '/login', + component: lazy(() => import('../pages/LoginPage/Login.tsx')), + }, + ], + }, + { + path: '**', + component: () =>
404
, + }, +] + +export default routes diff --git a/tsconfig.app.json b/tsconfig.app.json index 5f0a5ca..da15d3f 100644 --- a/tsconfig.app.json +++ b/tsconfig.app.json @@ -24,5 +24,5 @@ "noFallthroughCasesInSwitch": true, "noUncheckedSideEffectImports": true }, - "include": ["src"] + "include": ["src", "index.tsx"] }