From 18ca12f176efeb32278e46236de996504c241178 Mon Sep 17 00:00:00 2001
From: "tangly1024.com" <tlyong1992@hotmail.com>
Date: Tue, 6 Jun 2023 19:01:05 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=8A=A8=E6=80=81=E4=B8=BB?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/Loading.js |  2 +-
 pages/index.js        | 35 ++++++++++++++++++++++++-----------
 2 files changed, 25 insertions(+), 12 deletions(-)

diff --git a/components/Loading.js b/components/Loading.js
index 5f5b10d9..e7c5f5a1 100644
--- a/components/Loading.js
+++ b/components/Loading.js
@@ -18,7 +18,7 @@ const Loading = (props) => {
   }, [theme])
 
   return <div className="w-screen h-screen flex justify-center items-center bg-black">
-        <h1 className="text-2xl"><i className='mr-5 fas fa-spinner animate-spin' /></h1>
+       <i className='mr-5 fas fa-spinner animate-spin text-2xl' />
     </div>
 }
 export default Loading
diff --git a/pages/index.js b/pages/index.js
index 86ee427a..6aa7fc52 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -5,25 +5,38 @@ import { useGlobal } from '@/lib/global'
 import { generateRss } from '@/lib/rss'
 import { generateRobotsTxt } from '@/lib/robots.txt'
 import dynamic from 'next/dynamic'
-import Loading from '@/components/Loading'
-import { memorize } from '@/lib/utils'
+import { useEffect, useState } from 'react'
+
+/**
+ * 懒加载默认主题
+ */
+const DefaultLayoutIndex = dynamic(() => import(`@/themes/${BLOG.THEME}`).then(async (m) => {
+  return m.LayoutIndex
+}), { ssr: true })
 
 /**
  * 首页布局
  * @param {*} props
  * @returns
  */
-const Index = memorize(props => {
-  const { theme } = useGlobal()
-  const LayoutIndex = dynamic(
-    () =>
-      import(`@/themes/${theme}`).then((m) => {
+const Index = props => {
+  // 动态切换主题
+  const { theme, setOnReading } = useGlobal()
+  const [LayoutIndex, setLayoutIndex] = useState(DefaultLayoutIndex)
+
+  useEffect(() => {
+    const loadLayout = async () => {
+      const NewLayoutIndex = dynamic(() => import(`@/themes/${theme}`).then(async (m) => {
+        setOnReading(false)
         return m.LayoutIndex
-      }),
-    { ssr: true, loading: () => <Loading /> }
-  )
+      }), { ssr: true })
+      setLayoutIndex(NewLayoutIndex)
+    }
+    loadLayout()
+  }, [theme])
+
   return <LayoutIndex {...props} />
-})
+}
 
 /**
  * SSG 获取数据