fuksawa-animate

themes/fukasawa/components/MenuList.js

@@ -31,10 +31,10 @@ export const MenuList = (props) => {
 
   return (<>
         <menu id='nav-pc' className='hidden md:block font-sans text-sm z-10'>
-            {links?.map(link => <MenuItemDrop key={link?.id} link={link} />)}
+            {links?.map((link, index) => <MenuItemDrop key={index} link={link} />)}
         </menu>
         <menu id='nav-mobile' className='block md:hidden font-sans text-sm z-10 pb-1'>
-            {links?.map(link => <MenuItemCollapse key={link?.id} link={link} onHeightChange={props.onHeightChange}/>)}
+            {links?.map((link, index) => <MenuItemCollapse key={index} link={link} onHeightChange={props.onHeightChange}/>)}
         </menu>
     </>
 

themes/fukasawa/index.js

@@ -60,14 +60,6 @@ const LayoutBase = (props) => {
     }
   }, [isCollapsed])
 
-  // 增加一个状态以触发 Transition 组件的动画
-  const [showTransition, setShowTransition] = useState(true)
-  useEffect(() => {
-    // 当 location 或 children 发生变化时，触发动画
-    setShowTransition(false)
-    setTimeout(() => setShowTransition(true), 5)
-  }, [onLoading])
-
   if (isBrowser()) {
     loadExternalResource('/css/theme-fukasawa.css', 'css')
   }
@@ -87,7 +79,7 @@ const LayoutBase = (props) => {
                         <div id='container-inner' className='2xl:max-w-6xl md:max-w-4xl w-full relative z-10'>
 
                             <Transition
-                                show={showTransition}
+                                show={!onLoading}
                                 appear={true}
                                 className="w-full"
                                 enter="transition ease-in-out duration-700 transform order-first"