diff --git a/package.json b/package.json index c89999d..83edae1 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ }, "dependencies": { "@reduxjs/toolkit": "^1.9.3", + "ahooks": "^3.7.6", "antd": "^5.3.2", "axios": "^1.3.4", "echarts": "^5.4.2", diff --git a/src/compenents/keep-alive/index.tsx b/src/compenents/keep-alive/index.tsx new file mode 100644 index 0000000..94a10f4 --- /dev/null +++ b/src/compenents/keep-alive/index.tsx @@ -0,0 +1,29 @@ +import { useUpdate } from "ahooks"; +import { useEffect, useRef } from "react"; +import { useLocation, useOutlet } from "react-router-dom"; + +function KeepAlive() { + const componentList = useRef(new Map()); + const outLet = useOutlet(); + const { pathname } = useLocation(); + const forceUpdate = useUpdate(); + + useEffect(() => { + if (!componentList.current.has(pathname)) { + componentList.current.set(pathname, outLet); + } + forceUpdate(); + }, [pathname]); + + return ( +
+ {Array.from(componentList.current).map(([key, component]) => ( +
+ {component} +
+ ))} +
+ ); +} + +export default KeepAlive; diff --git a/src/compenents/left-menu/index.tsx b/src/compenents/left-menu/index.tsx index c3ce869..07d4b24 100644 --- a/src/compenents/left-menu/index.tsx +++ b/src/compenents/left-menu/index.tsx @@ -50,7 +50,7 @@ const items = [ "user", , [ - getItem("学员", "/member", null, null, null), + getItem("学员", "/member/index", null, null, null), getItem("部门", "/department", null, null, null), ], null diff --git a/src/pages/dashboard/index.tsx b/src/pages/dashboard/index.tsx index 1fa89ef..efa7120 100644 --- a/src/pages/dashboard/index.tsx +++ b/src/pages/dashboard/index.tsx @@ -199,7 +199,7 @@ const DashboardPage = () => {
{ - navigate("/member"); + navigate("/member/index"); }} > { type="link" style={{ paddingLeft: 4, paddingRight: 4 }} danger - onClick={() => navigate("/member")} + onClick={() => navigate("/member/index")} > ({res.data.users.length}个学员), diff --git a/src/routes/index.tsx b/src/routes/index.tsx index 2f1ee5d..1e0c7af 100644 --- a/src/routes/index.tsx +++ b/src/routes/index.tsx @@ -4,6 +4,7 @@ import { login, system } from "../api"; import InitPage from "../pages/init"; import { getToken } from "../utils"; +import KeepAlive from "../compenents/keep-alive"; import LoginPage from "../pages/login"; import HomePage from "../pages/home"; @@ -94,19 +95,22 @@ const routes: RouteObject[] = [ }, { path: "/member", - element: , - }, - { - path: "/member/import", - element: , - }, - { - path: "/member/learn", - element: , - }, - { - path: "/member/departmentUser", - element: , + element: , + children: [ + { path: "/member/index", element: }, + { + path: "/member/import", + element: , + }, + { + path: "/member/learn", + element: , + }, + { + path: "/member/departmentUser", + element: , + }, + ], }, { path: "/system/config/index",