|
|
@@ -1,9 +1,9 @@
|
|
|
"use client";
|
|
|
|
|
|
-import { usePathname } from "@/i18n";
|
|
|
-import { AnimatePresence, motion } from "framer-motion";
|
|
|
+import { AnimatePresence } from "framer-motion";
|
|
|
import { LayoutRouterContext } from "next/dist/shared/lib/app-router-context.shared-runtime";
|
|
|
-import { ReactNode, useContext, useRef } from "react";
|
|
|
+import { usePathname } from "next/navigation";
|
|
|
+import { ReactNode, useContext, useEffect, useRef } from "react";
|
|
|
|
|
|
// FrozenRouter 组件，保持页面切换过程中上下文的持久化
|
|
|
function FrozenRouter(props: { children: ReactNode }) {
|
|
|
@@ -25,20 +25,29 @@ const variants = {
|
|
|
const PageTransitionEffect = ({ children }: { children: ReactNode }) => {
|
|
|
// 使用 usePathname 钩子获取路径名作为 key，以在路由更改时触发重新渲染
|
|
|
const key = usePathname();
|
|
|
- console.log(`🎯🎯🎯🎯🎯-> in index.tsx on 28`, key);
|
|
|
+
|
|
|
+ useEffect(() => {
|
|
|
+ let width = document.documentElement.clientWidth;
|
|
|
+ let font = 1440 / 10 + "px";
|
|
|
+ // document.documentElement.style.fontSize = font;
|
|
|
+
|
|
|
+ console.log(`🎯🎯🎯🎯🎯-> in layout.tsx on 31`, font);
|
|
|
+ }, []);
|
|
|
+
|
|
|
return (
|
|
|
<AnimatePresence mode="popLayout">
|
|
|
- <motion.div
|
|
|
- key={key}
|
|
|
- initial="hidden"
|
|
|
- animate="enter"
|
|
|
- exit="exit"
|
|
|
- transition={{ type: "linear" }}
|
|
|
- className="overflow-hidden"
|
|
|
- >
|
|
|
- {/*<FrozenRouter></FrozenRouter>*/}
|
|
|
- {children}
|
|
|
- </motion.div>
|
|
|
+ {/*<motion.div*/}
|
|
|
+ {/* key={key}*/}
|
|
|
+ {/* initial="hidden"*/}
|
|
|
+ {/* animate="enter"*/}
|
|
|
+ {/* exit="exit"*/}
|
|
|
+ {/* variants={variants}*/}
|
|
|
+ {/* transition={{ type: "linear" }}*/}
|
|
|
+ {/* className="overflow-hidden"*/}
|
|
|
+ {/*>*/}
|
|
|
+ {/* <FrozenRouter>{children}</FrozenRouter>*/}
|
|
|
+ {/*</motion.div>*/}
|
|
|
+ {children}
|
|
|
</AnimatePresence>
|
|
|
);
|
|
|
};
|
