学员各页面缓存

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 (
+    <div>
+      {Array.from(componentList.current).map(([key, component]) => (
+        <div key={key} style={{ display: pathname === key ? "block" : "none" }}>
+          {component}
+        </div>
+      ))}
+    </div>
+  );
+}
+
+export default KeepAlive;

src/compenents/left-menu/index.tsx

@@ -50,7 +50,7 @@ const items = [
     "user",
     <i className="iconfont icon-icon-user" />,
     [
-      getItem("学员", "/member", null, null, null),
+      getItem("学员", "/member/index", null, null, null),
       getItem("部门", "/department", null, null, null),
     ],
     null