自动滚到到顶部

src/AutoTop.ts

@@ -0,0 +1,12 @@
+import { useLayoutEffect } from "react";
+import { useLocation } from "react-router-dom";
+
+const AutoScorllTop = ({ children }) => {
+  const location = useLocation();
+  useLayoutEffect(() => {
+    document.documentElement.scrollTo(0, 0);
+  }, [location.pathname]);
+  return children;
+};
+
+export default AutoScorllTop;

src/main.tsx

@@ -7,6 +7,7 @@ import { Provider } from "react-redux";
 import store from "./store";
 import { ConfigProvider } from "antd";
 import zhCN from "antd/locale/zh_CN";
+import AutoScorllTop from "./AutoTop";
 
 ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
   <Provider store={store}>
@@ -15,7 +16,9 @@ ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
       theme={{ token: { colorPrimary: "#ff4d4f" } }}
     >
       <BrowserRouter>
-        <App />
+        <AutoScorllTop>
+          <App />
+        </AutoScorllTop>
       </BrowserRouter>
     </ConfigProvider>
   </Provider>