somebuild-org
/
my-react-app
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

feat: route to v7

v7
npmrun 5 months ago
parent
d8d538e39a
commit
5bcc5fa07a
13 changed files with 135 additions and 259 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 3
      package.json
  2. 147
      pnpm-lock.yaml
  3. 54
      src/App.tsx
  4. 18
      src/layout/base.tsx
  5. 16
      src/router-new/index.ts
  6. 54
      src/router/route.tsx
  7. 18
      src/views/About.tsx
  8. 9
      src/views/Child.tsx
  9. 6
      src/views/Home/index.tsx
  10. 11
      src/views/PlayGround.tsx
  11. 34
      src/views/Project.tsx
  12. 4
      src/viewsSys/NoMatch.tsx

3
package.json
View File

@ -17,7 +17,6 @@
"@blueprintjs/icons": "^5.14.0",
"@blueprintjs/table": "^5.2.5",
"@types/lodash": "^4.17.13",
"@types/react-router-dom": "^5.3.3",
"appwrite": "^16.0.2",
"axios": "^1.7.7",
"framer-motion": "^11.11.17",
@ -28,7 +27,7 @@
"react-dom": "^18.3.1",
"react-hook-form": "^7.53.2",
"react-markdown": "^9.0.1",
"react-router-dom": "^5.3.4",
"react-router": "^7.0.1",
"react-toastify": "^10.0.6",
"styled-components": "^6.1.13"
},

147
pnpm-lock.yaml
View File

@ -23,9 +23,6 @@ importers:
'@types/lodash':
specifier: ^4.17.13
version: 4.17.13
'@types/react-router-dom':
specifier: ^5.3.3
version: 5.3.3
appwrite:
specifier: ^16.0.2
version: 16.0.2
@ -56,9 +53,9 @@ importers:
react-markdown:
specifier: ^9.0.1
version: 9.0.1(@types/react@18.3.12)(react@18.3.1)
react-router-dom:
specifier: ^5.3.4
version: 5.3.4(react@18.3.1)
react-router:
specifier: ^7.0.1
version: 7.0.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
react-toastify:
specifier: ^10.0.6
version: 10.0.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@ -537,6 +534,9 @@ packages:
'@swc/types@0.1.15':
resolution: {integrity: sha512-XKaZ+dzDIQ9Ot9o89oJQ/aluI17+VvUnIpYJTcZtvv1iYX6MzHh3Ik2CSR7MdPKpPwfZXHBeCingb2b4PoDVdw==}
'@types/cookie@0.6.0':
resolution: {integrity: sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA==}
'@types/debug@4.1.12':
resolution: {integrity: sha512-vIChWdVG3LG1SMxEvI/AK+FWJthlrqlTu7fbrlywTkkaONwk/UAGaULXRlf8vkzFBLVm0zkMdCquhL5aOjhXPQ==}
@ -549,9 +549,6 @@ packages:
'@types/hast@3.0.4':
resolution: {integrity: sha512-WPs+bbQw5aCj+x6laNGWLH3wviHtoCv/P3+otBhbOhJgG8qtpdAMlTCxLtsTWA7LH1Oh/bFCHsBn0TPS5m30EQ==}
'@types/history@4.7.11':
resolution: {integrity: sha512-qjDJRrmvBMiTx+jyLxvLfJU7UznFuokDv4f3WRuriHKERccVpFU+8XMQUAbDzoiJCsmexxRExQeMwwCdamSKDA==}
'@types/json-schema@7.0.15':
resolution: {integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==}
@ -573,12 +570,6 @@ packages:
'@types/react-dom@18.3.1':
resolution: {integrity: sha512-qW1Mfv8taImTthu4KoXgDfLuk4bydU6Q/TkADnDWWHwi4NX4BR+LWfTp2sVmTqRrsHvyDDTelgelxJ+SsejKKQ==}
'@types/react-router-dom@5.3.3':
resolution: {integrity: sha512-kpqnYK4wcdm5UaWI3fLcELopqLrHgLqNsdpHauzlQktfkHL3npOSwtj1Uz9oKBAzs7lFtVkV8j83voAz2D8fhw==}
'@types/react-router@5.1.20':
resolution: {integrity: sha512-jGjmu/ZqS7FjSH6owMcD5qpq19+1RS9DeVRqfl1FeBMxTDQAGwlMWOcs52NDoXaNKyG3d1cYQFMs9rCrb88o9Q==}
'@types/react@18.3.12':
resolution: {integrity: sha512-D2wOSq/d6Agt28q7rSI3jhU7G6aiuzljDGZ2hTZHIkrTLUI+AF3WMeKkEZ9nN2fkBAlcktT6vcZjDFiIhMYEQw==}
@ -763,6 +754,10 @@ packages:
constant-case@3.0.4:
resolution: {integrity: sha512-I2hSBi7Vvs7BEuJDr5dDHfzb/Ruj3FyvFyh7KLilAjNQw3Be+xgqUBA2W6scVEcL0hL1dwPRtIqEPVUCKkSsyQ==}
cookie@1.0.2:
resolution: {integrity: sha512-9Kr/j4O16ISv8zBBhJoi4bXOYNTkFLOqSL3UDB0njXxCXNezjeyVrJyGOWtgfs/q2km1gwBcfH8q1yEGoMYunA==}
engines: {node: '>=18'}
cross-spawn@7.0.5:
resolution: {integrity: sha512-ZVJrKKYunU38/76t0RMOulHOnUcbU9GbpWKAOZ0mhjr7CX6FVrH+4FrAapSOekrgFQ3f/8gwMEuIft0aKq6Hug==}
engines: {node: '>= 8'}
@ -976,12 +971,6 @@ packages:
header-case@2.0.4:
resolution: {integrity: sha512-H/vuk5TEEVZwrR0lp2zed9OCo1uAILMlx0JEMgC26rzyJJ3N1v6XkwHHXJQdR2doSjcGPM6OKPYoJgf0plJ11Q==}
history@4.10.1:
resolution: {integrity: sha512-36nwAD620w12kuzPAsyINPWJqlNbij+hpK1k9XRloDtym8mxzGYl2c17LnV6IAGB2Dmg4tEa7G7DlawS0+qjew==}
hoist-non-react-statics@3.3.2:
resolution: {integrity: sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==}
html-url-attributes@3.0.1:
resolution: {integrity: sha512-ol6UPyBWqsrO6EJySPz2O7ZSr856WDrEzM5zMqp+FJJLGMW35cLYmmZnl0vztAZxRUoNZJFTCohfjuIJ8I4QBQ==}
@ -1028,9 +1017,6 @@ packages:
resolution: {integrity: sha512-+Pgi+vMuUNkJyExiMBt5IlFoMyKnr5zhJ4Uspz58WOhBF5QoIZkFyNHIbBAtHwzVAgk5RtndVNsDRN61/mmDqg==}
engines: {node: '>=12'}
isarray@0.0.1:
resolution: {integrity: sha512-D2S+3GLxWH+uhrNEcoh/fnmYeP8E8/zHl644d/jdA0g2uyXvy3sb0qxotE+ne0LtccHknQzWwZEzhak7oJ0COQ==}
isexe@2.0.0:
resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==}
@ -1256,9 +1242,6 @@ packages:
resolution: {integrity: sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==}
engines: {node: '>=8'}
path-to-regexp@1.9.0:
resolution: {integrity: sha512-xIp7/apCFJuUHdDLWe8O1HIkb0kQrOMb/0u6FXQjemHn/ii5LrIzU6bdECnsiTF/GjZkMEKg1xdiZwNqDYlZ6g==}
picocolors@1.1.1:
resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==}
@ -1333,15 +1316,15 @@ packages:
react: ^16.8.0 || ^17 || ^18
react-dom: ^16.8.0 || ^17 || ^18
react-router-dom@5.3.4:
resolution: {integrity: sha512-m4EqFMHv/Ih4kpcBCONHbkT68KoAeHN4p3lAGoNryfHi0dMy0kCzEZakiKRsvg5wHZ/JLrLW8o8KomWiz/qbYQ==}
peerDependencies:
react: '>=15'
react-router@5.3.4:
resolution: {integrity: sha512-Ys9K+ppnJah3QuaRiLxk+jDWOR1MekYQrlytiXxC1RyfbdsZkS5pvKAzCCr031xHixZwpnsYNT5xysdFHQaYsA==}
react-router@7.0.1:
resolution: {integrity: sha512-WVAhv9oWCNsja5AkK6KLpXJDSJCQizOIyOd4vvB/+eHGbYx5vkhcmcmwWjQ9yqkRClogi+xjEg9fNEOd5EX/tw==}
engines: {node: '>=20.0.0'}
peerDependencies:
react: '>=15'
react: '>=18'
react-dom: '>=18'
peerDependenciesMeta:
react-dom:
optional: true
react-toastify@10.0.6:
resolution: {integrity: sha512-yYjp+omCDf9lhZcrZHKbSq7YMuK0zcYkDFTzfRFgTXkTFHZ1ToxwAonzA4JI5CxA91JpjFLmwEsZEgfYfOqI1A==}
@ -1382,9 +1365,6 @@ packages:
resolution: {integrity: sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==}
engines: {node: '>=4'}
resolve-pathname@3.0.0:
resolution: {integrity: sha512-C7rARubxI8bXFNB/hqcp/4iUeIXJhJZvFPFPiSPRnhU5UPxzMFIl+2E6yY6c4k9giDJAhtV+enfA+G89N6Csng==}
reusify@1.0.4:
resolution: {integrity: sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==}
engines: {iojs: '>=1.0.0', node: '>=0.10.0'}
@ -1408,6 +1388,9 @@ packages:
sentence-case@3.0.4:
resolution: {integrity: sha512-8LS0JInaQMCRoQ7YUytAo/xUu5W2XnQxV2HI/6uM6U7CITS1RqPElr30V6uIqyMKM9lJGRVFy5/4CuzcixNYSg==}
set-cookie-parser@2.7.1:
resolution: {integrity: sha512-IOc8uWeOZgnb3ptbCURJWNjWUPcO3ZnTTdzsurqERrP6nPyv+paC55vJM0LpOlT2ne+Ix+9+CRG1MNLlyZ4GjQ==}
shallowequal@1.1.0:
resolution: {integrity: sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==}
@ -1453,12 +1436,6 @@ packages:
resolution: {integrity: sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==}
engines: {node: '>=8'}
tiny-invariant@1.3.3:
resolution: {integrity: sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==}
tiny-warning@1.0.3:
resolution: {integrity: sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==}
to-regex-range@5.0.1:
resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==}
engines: {node: '>=8.0'}
@ -1481,6 +1458,9 @@ packages:
tslib@2.6.3:
resolution: {integrity: sha512-xNvxJEOUiWPGhUuUdQgAJPKOOJfGnIyKySOc09XkKsgdUV/3E2zvwZYdejjmRgPCgcym1juLH3226yA7sEFJKQ==}
turbo-stream@2.4.0:
resolution: {integrity: sha512-FHncC10WpBd2eOmGwpmQsWLDoK4cqsA/UT/GqNoaKOQnT8uzhtCbg3EoUDMvqpOSAI0S26mr0rkjzbOO6S3v1g==}
type-check@0.4.0:
resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==}
engines: {node: '>= 0.8.0'}
@ -1534,9 +1514,6 @@ packages:
peerDependencies:
react: ^16.8.0 || ^17.0.0 || ^18.0.0
value-equal@1.0.1:
resolution: {integrity: sha512-NOJ6JZCAWr0zlxZt+xqCHNTEKOsrks2HQd4MqhP1qy4z1SkbEP467eNx6TgDKXMvUOb+OENfJCZwM+16n7fRfw==}
vfile-message@4.0.2:
resolution: {integrity: sha512-jRDZ1IMLttGj41KcZvlrYAaI3CfqpLpfpf+Mfig13viT6NKvRzWZ+lXz0Y5D60w6uJIBAOGq9mSHf0gktF0duw==}
@ -1890,6 +1867,8 @@ snapshots:
dependencies:
'@swc/counter': 0.1.3
'@types/cookie@0.6.0': {}
'@types/debug@4.1.12':
dependencies:
'@types/ms': 0.7.34
@ -1904,8 +1883,6 @@ snapshots:
dependencies:
'@types/unist': 3.0.3
'@types/history@4.7.11': {}
'@types/json-schema@7.0.15': {}
'@types/lodash@4.17.13': {}
@ -1926,17 +1903,6 @@ snapshots:
dependencies:
'@types/react': 18.3.12
'@types/react-router-dom@5.3.3':
dependencies:
'@types/history': 4.7.11
'@types/react': 18.3.12
'@types/react-router': 5.1.20
'@types/react-router@5.1.20':
dependencies:
'@types/history': 4.7.11
'@types/react': 18.3.12
'@types/react@18.3.12':
dependencies:
'@types/prop-types': 15.7.13
@ -2155,6 +2121,8 @@ snapshots:
tslib: 2.6.3
upper-case: 2.0.2
cookie@1.0.2: {}
cross-spawn@7.0.5:
dependencies:
path-key: 3.1.1
@ -2407,19 +2375,6 @@ snapshots:
capital-case: 1.0.4
tslib: 2.6.3
history@4.10.1:
dependencies:
'@babel/runtime': 7.26.0
loose-envify: 1.4.0
resolve-pathname: 3.0.0
tiny-invariant: 1.3.3
tiny-warning: 1.0.3
value-equal: 1.0.1
hoist-non-react-statics@3.3.2:
dependencies:
react-is: 16.13.1
html-url-attributes@3.0.1: {}
ignore@5.3.2: {}
@ -2454,8 +2409,6 @@ snapshots:
is-plain-obj@4.1.0: {}
isarray@0.0.1: {}
isexe@2.0.0: {}
jotai@2.10.3(@types/react@18.3.12)(react@18.3.1):
@ -2811,10 +2764,6 @@ snapshots:
path-key@3.1.1: {}
path-to-regexp@1.9.0:
dependencies:
isarray: 0.0.1
picocolors@1.1.1: {}
picomatch@2.3.1: {}
@ -2893,29 +2842,15 @@ snapshots:
react-fast-compare: 3.2.2
warning: 4.0.3
react-router-dom@5.3.4(react@18.3.1):
dependencies:
'@babel/runtime': 7.26.0
history: 4.10.1
loose-envify: 1.4.0
prop-types: 15.8.1
react: 18.3.1
react-router: 5.3.4(react@18.3.1)
tiny-invariant: 1.3.3
tiny-warning: 1.0.3
react-router@5.3.4(react@18.3.1):
react-router@7.0.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
dependencies:
'@babel/runtime': 7.26.0
history: 4.10.1
hoist-non-react-statics: 3.3.2
loose-envify: 1.4.0
path-to-regexp: 1.9.0
prop-types: 15.8.1
'@types/cookie': 0.6.0
cookie: 1.0.2
react: 18.3.1
react-is: 16.13.1
tiny-invariant: 1.3.3
tiny-warning: 1.0.3
set-cookie-parser: 2.7.1
turbo-stream: 2.4.0
optionalDependencies:
react-dom: 18.3.1(react@18.3.1)
react-toastify@10.0.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
dependencies:
@ -2964,8 +2899,6 @@ snapshots:
resolve-from@4.0.0: {}
resolve-pathname@3.0.0: {}
reusify@1.0.4: {}
rollup@4.27.2:
@ -3008,6 +2941,8 @@ snapshots:
tslib: 2.6.3
upper-case-first: 2.0.2
set-cookie-parser@2.7.1: {}
shallowequal@1.1.0: {}
shebang-command@2.0.0:
@ -3056,10 +2991,6 @@ snapshots:
dependencies:
has-flag: 4.0.0
tiny-invariant@1.3.3: {}
tiny-warning@1.0.3: {}
to-regex-range@5.0.1:
dependencies:
is-number: 7.0.0
@ -3076,6 +3007,8 @@ snapshots:
tslib@2.6.3: {}
turbo-stream@2.4.0: {}
type-check@0.4.0:
dependencies:
prelude-ls: 1.2.1
@ -3144,8 +3077,6 @@ snapshots:
dependencies:
react: 18.3.1
value-equal@1.0.1: {}
vfile-message@4.0.2:
dependencies:
'@types/unist': 3.0.3

54
src/App.tsx
View File

@ -1,29 +1,31 @@
import AppRouter from "@/router/AppRouter"
import { ToastContainer, Bounce } from 'react-toastify';
import { HashRouter, Navigate, Route, Routes } from "react-router"
import { ToastContainer, Bounce } from "react-toastify"
import BaseLayout from "@/layout/base"
import Home from "@/views/Home"
import NoMatch from "@/viewsSys/NoMatch"
export default function App() {
return <>
<AppRouter></AppRouter>
<ToastContainer
position="bottom-right"
autoClose={5000}
hideProgressBar
closeOnClick={false}
pauseOnFocusLoss
pauseOnHover
theme="light"
transition={Bounce}
/>
{/* <ToastContainer
stacked
position="bottom-right"
autoClose={5000}
hideProgressBar
closeOnClick={false}
pauseOnFocusLoss
pauseOnHover
theme="light"
transition={Bounce}
/> */}
</>
return (
<>
<HashRouter>
<Routes>
<Route path="/" element={<BaseLayout />}>
<Route index element={<Navigate to="home" replace />} />
<Route path="home" element={<Home />} />
<Route path="*" element={<NoMatch />} />
</Route>
</Routes>
</HashRouter>
<ToastContainer
position="bottom-right"
autoClose={5000}
hideProgressBar
closeOnClick={false}
pauseOnFocusLoss
pauseOnHover
theme="light"
transition={Bounce}
/>
</>
)
}

18
src/layout/base.tsx
View File

@ -1,6 +1,6 @@
import { Alignment, Button, Dialog, DialogBody, DialogFooter, Menu, MenuDivider, MenuItem, Navbar, Popover } from "@blueprintjs/core"
import { ReactNode, useState } from "react"
import { NavLink, useHistory } from "react-router-dom"
import { NavLink, Outlet } from "react-router"
import styled from "styled-components"
import { GlobalStyles } from "./GlobalStyles"
import { Notice } from "@/ui/Notice"
@ -9,7 +9,7 @@ import { Register } from "@/ui/Register/Register"
import { Login } from "@/ui/Login/Login"
interface PageProps {
children: ReactNode
// children: ReactNode
}
const PageWrapper = styled.div`
@ -31,8 +31,6 @@ function BaseLayout(props: PageProps) {
const [isOpenAuth, setIsOpenAuth] = useState(false)
const [isRegister, setIsRegister] = useState(false)
const router = useHistory()
const about = `
> 人生如逆水行舟，不进则退。
@ -50,7 +48,7 @@ function BaseLayout(props: PageProps) {
<Navbar.Group align={Alignment.LEFT}>
<Navbar.Heading>天涯行宫</Navbar.Heading>
<Navbar.Divider />
<NavLink to={"/home"} strict exact activeClassName="actived">
<NavLink to={"/home"}>
<Button className="bp5-minimal" icon="home" text="首页" />
</NavLink>
<Popover
@ -59,8 +57,8 @@ function BaseLayout(props: PageProps) {
onInteraction={isOpen => setIsOpen(isOpen)}
content={
<Menu>
<MenuItem icon="flow-review-branch" text="天涯笔记" disabled onClick={() => router.push("/project")} />
<MenuItem icon="third-party" text="全聚德" disabled onClick={() => router.push("/project/child")} />
<MenuItem icon="flow-review-branch" text="天涯笔记" disabled />
<MenuItem icon="third-party" text="全聚德" disabled />
<MenuDivider />
<MenuItem icon="document" text="文档">
<MenuItem icon="build" text="CSS选择器示例" />
@ -84,11 +82,13 @@ function BaseLayout(props: PageProps) {
<Button icon="user" className="bp5-minimal" text="登录 / 注册" onClick={() => setIsOpenAuth(true)} />
<Navbar.Divider />
<NavLink to={"/about"}>
<Button onClick={() => setIsOpenAbout(true)} className="bp5-minimal" text="关于" />
<Button onClick={() => setIsOpenAbout(true)} className="bp5-minimal" text="关于" />
</NavLink>
</Navbar.Group>
</Navbar>
<ContentWrapper>{props.children}</ContentWrapper>
<ContentWrapper>
<Outlet />
</ContentWrapper>
<Dialog isOpen={isOpenAbout} title="关于我" icon="info-sign" onClose={() => setIsOpenAbout(false)}>
<DialogBody>
<Markdown>{about}</Markdown>

16
src/router-new/index.ts
View File

@ -0,0 +1,16 @@
import { createHashRouter } from "react-router-dom"
const router = createHashRouter([
{
path: "/",
element: ()=>import("@/views/Home"),
loader: rootLoader,
children: [
{
path: "team",
element: <Team />,
loader: teamLoader,
},
],
},
])

54
src/router/route.tsx
View File

@ -38,33 +38,33 @@ const routesArray = [
// loading: () => <Loading color="blue"></Loading>,
root: true,
},
{
path: "/project",
component: lazy(() => import("@/views/Project")),
exact: false,
root: true,
meta: {
auth: false,
},
children: [
{
path: "/project/child",
component: lazy(() => import("@/views/Child")),
exact: true,
children: [],
meta: {
auth: true,
},
},
],
},
{
path: "/about",
component: lazy(() => import("@/views/About")),
exact: true,
root: true,
children: [],
},
// {
// path: "/project",
// component: lazy(() => import("@/views/Project")),
// exact: false,
// root: true,
// meta: {
// auth: false,
// },
// children: [
// {
// path: "/project/child",
// component: lazy(() => import("@/views/Child")),
// exact: true,
// children: [],
// meta: {
// auth: true,
// },
// },
// ],
// },
// {
// path: "/about",
// component: lazy(() => import("@/views/About")),
// exact: true,
// root: true,
// children: [],
// },
{
path: "*",
exact: false,

18
src/views/About.tsx
View File

@ -1,18 +0,0 @@
import withPage from "@/base/withPage";
import { Button, Dialog, DialogBody, DialogFooter } from "@blueprintjs/core";
import { useCallback, useState } from "react";
function About() {
const [isOpen, setIsOpen] = useState(false);
const toggleOverlay = useCallback(() => setIsOpen(open => !open), [setIsOpen]);
const handleClose = useCallback(() => setIsOpen(false), []);
return <>
<Button text="点击打开美丽的按钮" onClick={toggleOverlay} />
<Dialog isOpen={isOpen} title="关于我" icon="info-sign" onClose={handleClose}>
<DialogBody>{/* body contents here */}</DialogBody>
<DialogFooter actions={<Button intent="primary" text="关闭" onClick={handleClose} />} />
</Dialog>
</>
}
export default withPage(About)

9
src/views/Child.tsx
View File

@ -1,9 +0,0 @@
import { Button } from "@blueprintjs/core";
function Child() {
return <>
<Button text="点击打开美丽的按钮"/>
</>
}
export default Child

6
src/views/Home/index.tsx
View File

@ -6,10 +6,10 @@ import { ReactNode, useCallback } from "react"
import { toast } from "react-toastify"
interface IProps {
children: ReactNode
// children: ReactNode
}
export default withPage(function Project({}: IProps) {
export default function Home({}: IProps) {
const onClick = useCallback(() => {
toast.success("Wow so easy !")
// Fly.invoke().request<{a: number}>({
@ -28,4 +28,4 @@ export default withPage(function Project({}: IProps) {
</div>
</>
)
})
}

11
src/views/PlayGround.tsx
View File

@ -1,11 +0,0 @@
import withPage from "@/base/withPage"
function PlayGround() {
return (
<>
<div>PlayGround</div>
</>
)
}
export default withPage(PlayGround)

34
src/views/Project.tsx
View File

@ -1,34 +0,0 @@
import withPage from "@/base/withPage"
import { useHistory } from "react-router-dom"
import styled from "styled-components"
const Title = styled.h1`
font-size: 1.5em;
text-align: center;
color: #bf4f74;
`
const Wrapper = styled.section`
padding: 4em;
background: papayawhip;
`
export default withPage(function Project({ children }) {
const router = useHistory()
function toChild() {
router.push("/project/child")
}
return (
<>
<Wrapper>
<Title>Hello World!</Title>
</Wrapper>
<div>
<div onClick={toChild} style={{ height: "200px" }}>
vaas
</div>
{children}
</div>
</>
)
})

4
src/viewsSys/404.tsx → src/viewsSys/NoMatch.tsx
View File

@ -1,8 +1,8 @@
import { LeftIn } from "@/effect"
export default function Page404() {
export default function NoMatch() {
return (
<div className="h-1/1 flex" style={{display: "flex",alignItems: "center", justifyContent: "center", height: "100%"}}>
<div className="h-1/1 flex" style={{ display: "flex", alignItems: "center", justifyContent: "center", height: "100%" }}>
<LeftIn className="m-auto">
404
{/* <img className="p-40px" src="static/404.jpg" alt="" /> */}
Write Preview
Loading…
Cancel
Save