From 05e82eafbafc9c191318312fbab509e604bc6936 Mon Sep 17 00:00:00 2001 From: canisminor1990 Date: Sun, 24 Nov 2024 21:58:25 +0800 Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix:=20Fix=20ssr?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/layouts/DocLayout/DocumentLayout.tsx | 2 +- src/layouts/DocLayout/Head/Og.tsx | 9 ++++---- src/layouts/DocLayout/Head/StructuredData.tsx | 23 +++++++++---------- src/pages/Changelog/index.tsx | 4 ++-- src/pages/Docs/index.tsx | 4 ++-- src/pages/Home/index.tsx | 4 ++-- src/slots/Toc/index.tsx | 7 +++--- 7 files changed, 27 insertions(+), 26 deletions(-) diff --git a/src/layouts/DocLayout/DocumentLayout.tsx b/src/layouts/DocLayout/DocumentLayout.tsx index 311d5b9..fefda14 100644 --- a/src/layouts/DocLayout/DocumentLayout.tsx +++ b/src/layouts/DocLayout/DocumentLayout.tsx @@ -76,7 +76,7 @@ const DocumentLayout = memo(() => { const elm = document.querySelector(`#${decodeURIComponent(id)}`); if (elm) { elm.scrollIntoView(); - window.scrollBy({ top: -80 }); + window?.scrollBy({ top: -80 }); } }, 1); }, [loading, hash]); diff --git a/src/layouts/DocLayout/Head/Og.tsx b/src/layouts/DocLayout/Head/Og.tsx index bfe3822..701e527 100644 --- a/src/layouts/DocLayout/Head/Og.tsx +++ b/src/layouts/DocLayout/Head/Og.tsx @@ -6,21 +6,22 @@ import urlJoin from 'url-join'; import { siteSelectors, useSiteStore } from '@/store'; const Og: FC = () => { - const [title, desc, logo, hostname] = useSiteStore((s) => [ + const [title, desc, logo, hostname, pathname] = useSiteStore((s) => [ siteSelectors.siteTitle(s), siteSelectors.siteDesc(s), siteSelectors.logo(s), - siteSelectors.hostname(s), + siteSelectors.hostname(s) || 'https://lobehub.com', + s.location.pathname, ]); const metadata = useSiteStore(siteSelectors.metadata, isEqual); return ( {metadata?.title || title} - + - + diff --git a/src/layouts/DocLayout/Head/StructuredData.tsx b/src/layouts/DocLayout/Head/StructuredData.tsx index 5180c79..66736e8 100644 --- a/src/layouts/DocLayout/Head/StructuredData.tsx +++ b/src/layouts/DocLayout/Head/StructuredData.tsx @@ -12,46 +12,45 @@ const StructuredData: FC = () => { siteSelectors.siteTitle(s), siteSelectors.siteDesc(s), siteSelectors.logo(s), - siteSelectors.hostname(s), + siteSelectors.hostname(s) || 'https://lobehub.com', ]); const metadata = useSiteStore(siteSelectors.metadata, isEqual); - const host = hostname || location.origin; const ld = { '@context': 'https://schema.org', '@graph': [ { - '@id': urlJoin(host, '#website'), + '@id': urlJoin(hostname, '#website'), '@type': 'WebSite', 'description': desc, 'inLanguage': 'en-US', 'name': 'LobeHub', - 'publisher': { '@id': urlJoin(host, '#organization') }, - 'url': host, + 'publisher': { '@id': urlJoin(hostname, '#organization') }, + 'url': hostname, }, { - '@id': host, + '@id': hostname, '@type': 'WebPage', - 'about': { '@id': urlJoin(host, '#organization') }, + 'about': { '@id': urlJoin(hostname, '#organization') }, 'dateModified': date, 'datePublished': date, 'description': desc, - 'image': { '@id': urlJoin(host, '#primaryimage') }, + 'image': { '@id': urlJoin(hostname, '#primaryimage') }, 'inLanguage': 'en-US', - 'isPartOf': { '@id': urlJoin(host, '#website') }, + 'isPartOf': { '@id': urlJoin(hostname, '#website') }, 'name': title, - 'primaryImageOfPage': { '@id': urlJoin(host, '#primaryimage') }, + 'primaryImageOfPage': { '@id': urlJoin(hostname, '#primaryimage') }, 'thumbnailUrl': metadata?.twitter?.image || metadata?.openGraph?.image, }, { - '@id': urlJoin(host, '#primaryimage'), + '@id': urlJoin(hostname, '#primaryimage'), '@type': 'ImageObject', 'contentUrl': metadata?.twitter?.image || metadata?.openGraph?.image || logo, 'inLanguage': 'en-US', 'url': metadata?.twitter?.image || metadata?.openGraph?.image || logo, }, { - '@id': urlJoin(host, '#organization'), + '@id': urlJoin(hostname, '#organization'), '@type': 'Organization', 'alternateName': 'LobeHub', 'contactPoint': { diff --git a/src/pages/Changelog/index.tsx b/src/pages/Changelog/index.tsx index d195f4f..bcba5e8 100644 --- a/src/pages/Changelog/index.tsx +++ b/src/pages/Changelog/index.tsx @@ -24,8 +24,8 @@ const Changelog = memo(() => { const { styles } = useStyles(); useEffect(() => { - window.scrollTo(0, 0); - document.body.scrollTo(0, 0); + window?.scrollTo(0, 0); + document?.body.scrollTo(0, 0); }, []); return ( diff --git a/src/pages/Docs/index.tsx b/src/pages/Docs/index.tsx index 72c3c36..d77646a 100644 --- a/src/pages/Docs/index.tsx +++ b/src/pages/Docs/index.tsx @@ -20,8 +20,8 @@ const Documents = memo(() => { const { styles } = useStyles(); useEffect(() => { - window.scrollTo(0, 0); - document.body.scrollTo(0, 0); + window?.scrollTo(0, 0); + document?.body.scrollTo(0, 0); }, [location.pathname]); const Comment = useCallback( diff --git a/src/pages/Home/index.tsx b/src/pages/Home/index.tsx index cbff6d5..bb8131f 100644 --- a/src/pages/Home/index.tsx +++ b/src/pages/Home/index.tsx @@ -9,8 +9,8 @@ const Home = memo(() => { const outlet = useOutlet(); useEffect(() => { - window.scrollTo(0, 0); - document.body.scrollTo(0, 0); + window?.scrollTo(0, 0); + document?.body.scrollTo(0, 0); }, []); return ( diff --git a/src/slots/Toc/index.tsx b/src/slots/Toc/index.tsx index aa7d350..b323c39 100644 --- a/src/slots/Toc/index.tsx +++ b/src/slots/Toc/index.tsx @@ -11,12 +11,13 @@ const Toc = memo(() => { const items = useSiteStore(siteSelectors.tocAnchorItem, isEqual); const { mobile } = useResponsive(); const theme = useTheme(); + const hash = useSiteStore((s) => s.location.hash, isEqual); const [spacing, setSpacing] = useState(GAP); useEffect(() => { - const ApiTitle = document.querySelector('#api-header'); + const ApiTitle = document?.querySelector('#api-header'); if (ApiTitle) setSpacing(ApiTitle.clientHeight + GAP); - }, [window.location.href, items]); + }, [hash, items]); if (items?.length < 1) return; @@ -24,7 +25,7 @@ const Toc = memo(() => { <> {!mobile &&
} document.body} + getContainer={() => document?.body} headerHeight={theme.headerHeight} isMobile={mobile} items={items}