From fc23e4950b74f19b05837a9e89d14931f0cf9ed7 Mon Sep 17 00:00:00 2001 From: pengzhanbo Date: Tue, 16 Jul 2024 00:16:02 +0800 Subject: [PATCH] =?UTF-8?q?perf(theme):=20=E8=B0=83=E6=95=B4=20=E9=A1=B5?= =?UTF-8?q?=E9=9D=A2=E6=95=B0=E6=8D=AE=E7=BB=93=E6=9E=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- theme/src/client/components/VPContent.vue | 15 +++++++++------ theme/src/client/components/VPDoc.vue | 4 ++-- theme/src/client/components/VPDocMeta.vue | 6 +++--- theme/src/client/components/VPLocalNav.vue | 4 ++-- theme/src/client/composables/langs.ts | 4 ++-- theme/src/client/composables/page.ts | 8 +++++++- theme/src/client/composables/prev-next.ts | 4 ++-- 7 files changed, 27 insertions(+), 18 deletions(-) diff --git a/theme/src/client/components/VPContent.vue b/theme/src/client/components/VPContent.vue index 5047c142..238e7744 100644 --- a/theme/src/client/components/VPContent.vue +++ b/theme/src/client/components/VPContent.vue @@ -7,18 +7,15 @@ import VPHome from '@theme/Home/VPHome.vue' import VPFriends from '@theme/VPFriends.vue' import { useData, useSidebar } from '../composables/index.js' import { inBrowser } from '../utils/index.js' +import { useBlogPageData } from '../composables/page.js' const props = defineProps<{ isNotFound?: boolean }>() const { hasSidebar } = useSidebar() -const { frontmatter, page } = useData() - -const isBlogLayout = computed(() => { - const { type } = page.value - return type === 'blog' || type === 'blog-archives' || type === 'blog-tags' || type === 'blog-categories' -}) +const { frontmatter } = useData() +const { isBlogLayout } = useBlogPageData() watch([isBlogLayout, () => frontmatter.value.pageLayout], () => nextTick(() => inBrowser && document.documentElement.classList.toggle( @@ -54,6 +51,12 @@ watch([isBlogLayout, () => frontmatter.value.pageLayout], () => nextTick(() => + + diff --git a/theme/src/client/components/VPDoc.vue b/theme/src/client/components/VPDoc.vue index 8ab60784..fe2104b8 100644 --- a/theme/src/client/components/VPDoc.vue +++ b/theme/src/client/components/VPDoc.vue @@ -10,13 +10,13 @@ import { useEncrypt } from '../composables/encrypt.js' import { useSidebar } from '../composables/sidebar.js' import { useData } from '../composables/data.js' import { useHeaders } from '../composables/outline.js' -import { useBlogPost } from '../composables/page.js' +import { useBlogPageData } from '../composables/page.js' const { page, theme, frontmatter, isDark } = useData() const route = useRoute() const { hasSidebar, hasAside, leftAside } = useSidebar() -const { isBlogPost } = useBlogPost() +const { isBlogPost } = useBlogPageData() const headers = useHeaders() const { isPageDecrypted } = useEncrypt() diff --git a/theme/src/client/components/VPDocMeta.vue b/theme/src/client/components/VPDocMeta.vue index 0b603238..57b06582 100644 --- a/theme/src/client/components/VPDocMeta.vue +++ b/theme/src/client/components/VPDocMeta.vue @@ -4,11 +4,11 @@ import { useReadingTimeLocale } from '@vuepress/plugin-reading-time/client' import VPLink from '@theme/VPLink.vue' import { useData } from '../composables/data.js' import { useTagColors } from '../composables/tag-colors.js' -import { useBlogPost } from '../composables/page.js' +import { useBlogPageData } from '../composables/page.js' import { useBlogExtract } from '../composables/blog-extract.js' const { page, frontmatter: matter } = useData<'post'>() -const { isBlogPost } = useBlogPost() +const { isBlogPost } = useBlogPageData() const colors = useTagColors() const readingTime = useReadingTimeLocale() const { categories } = useBlogExtract() @@ -53,7 +53,7 @@ const hasMeta = computed(() => readingTime.value.time || tags.value.length || cr › -

+

{{ page.title }}

diff --git a/theme/src/client/components/VPLocalNav.vue b/theme/src/client/components/VPLocalNav.vue index f4465121..a76290d4 100644 --- a/theme/src/client/components/VPLocalNav.vue +++ b/theme/src/client/components/VPLocalNav.vue @@ -5,7 +5,7 @@ import VPLocalNavOutlineDropdown from '@theme/VPLocalNavOutlineDropdown.vue' import { useSidebar } from '../composables/sidebar.js' import { useHeaders } from '../composables/outline.js' import { useData } from '../composables/data.js' -import { useBlogPost } from '../composables/page.js' +import { useBlogPageData } from '../composables/page.js' const props = defineProps<{ open: boolean @@ -15,7 +15,7 @@ const props = defineProps<{ defineEmits<(e: 'openMenu') => void>() const { theme } = useData() -const { isBlogPost } = useBlogPost() +const { isBlogPost } = useBlogPageData() const { hasSidebar } = useSidebar() const { y } = useWindowScroll() diff --git a/theme/src/client/composables/langs.ts b/theme/src/client/composables/langs.ts index 8f7c749b..994b1149 100644 --- a/theme/src/client/composables/langs.ts +++ b/theme/src/client/composables/langs.ts @@ -4,7 +4,7 @@ import { normalizeLink } from '../utils/index.js' import { useThemeData } from './theme-data.js' import { useData } from './data.js' import { getSidebarFirstLink, useSidebarData } from './sidebar.js' -import { useBlogPost } from './page.js' +import { useBlogPageData } from './page.js' export function useLangs({ removeCurrent = true, @@ -13,7 +13,7 @@ export function useLangs({ const { page } = useData() const routeLocale = useRouteLocale() const sidebar = useSidebarData() - const { isBlogPost } = useBlogPost() + const { isBlogPost } = useBlogPageData() const currentLang = computed(() => { const link = routeLocale.value diff --git a/theme/src/client/composables/page.ts b/theme/src/client/composables/page.ts index 86474205..5e70cdfe 100644 --- a/theme/src/client/composables/page.ts +++ b/theme/src/client/composables/page.ts @@ -2,7 +2,7 @@ import { computed } from 'vue' import { useData } from './data.js' import { usePostList } from './blog-data.js' -export function useBlogPost() { +export function useBlogPageData() { const { page } = useData() const postList = usePostList() @@ -10,7 +10,13 @@ export function useBlogPost() { return postList.value.some(item => item.path === page.value.path) }) + const isBlogLayout = computed(() => { + const type = page.value.type + return type === 'blog' || type === 'blog-archives' || type === 'blog-tags' || type === 'blog-categories' + }) + return { isBlogPost, + isBlogLayout, } } diff --git a/theme/src/client/composables/prev-next.ts b/theme/src/client/composables/prev-next.ts index d9600e4c..4172f9ed 100644 --- a/theme/src/client/composables/prev-next.ts +++ b/theme/src/client/composables/prev-next.ts @@ -7,7 +7,7 @@ import { resolveNavLink } from '../utils/index.js' import { usePostList } from './blog-data.js' import { useSidebar } from './sidebar.js' import { useData } from './data.js' -import { useBlogPost } from './page.js' +import { useBlogPageData } from './page.js' export function usePrevNext() { const route = useRoute() @@ -15,7 +15,7 @@ export function usePrevNext() { const { sidebar } = useSidebar() const postList = usePostList() as unknown as Ref const locale = usePageLang() - const { isBlogPost } = useBlogPost() + const { isBlogPost } = useBlogPageData() const prevNavList = computed(() => { const prevConfig = resolveFromFrontmatterConfig(frontmatter.value.prev)