feat: 目录页中添加titleTag

xugaoyi · Feb 26, 2022 · 7f1747a · 7f1747a · vercel · Feb 26, 2022
1 parent 684060f
commit 7f1747a
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 31 deletions.
diff --git a/docs/.vuepress/config.ts b/docs/.vuepress/config.ts
@@ -1,11 +1,13 @@
+/**
+ * 提示：如您想使用JS版本的配置文件可参考：https://github.com/xugaoyi/vuepress-theme-vdoing/tree/a2f03e993dd2f2a3afdc57cf72adfc6f1b6b0c32/docs/.vuepress
+ */
 import { resolve } from 'path'
 import { defineConfig4CustomTheme } from 'vuepress/config'
 import { VdoingThemeConfig } from 'vuepress-theme-vdoing/types'
 import dayjs from 'dayjs'
 import baiduCode from './config/baiduCode' // 百度统计hm码
 import htmlModules from './config/htmlModules' // 自定义插入的html块
 
-
 export default defineConfig4CustomTheme<VdoingThemeConfig>({
   theme: 'vdoing', // 使用npm包主题
   // theme: resolve(__dirname, '../../vdoing'), // 使用本地主题

diff --git a/vdoing/components/Catalogue.vue b/vdoing/components/Catalogue.vue
@@ -13,13 +13,12 @@
         <template v-for="(item, index) in getCatalogueList()">
           <dl v-if="type(item) === 'array'" :key="index" class="inline">
             <dt>
-              <router-link :to="item[2]">{{
-                `${index + 1}. ${item[1]}` 
-              }}
-                <span class="title-tag" v-if="getTitleTag(item[2])">
-                  {{ getTitleTag(item[2]) }}
+              <router-link :to="item[2]"
+                >{{ `${index + 1}. ${item[1]}` }}
+                <span class="title-tag" v-if="item[3]">
+                  {{ item[3] }}
                 </span>
-              </router-link> 
+              </router-link>
             </dt>
           </dl>
           <dl v-else-if="type(item) === 'object'" :key="index">
@@ -32,11 +31,10 @@
               <!-- 二级目录 -->
               <template v-for="(c, i) in item.children">
                 <template v-if="type(c) === 'array'">
-                  <router-link :to="c[2]" :key="i">{{
-                    `${index + 1}-${i + 1}. ${c[1]}`
-                  }}
-                    <span class="title-tag" v-if="getTitleTag(c[2])">
-                      {{ getTitleTag(c[2]) }}
+                  <router-link :to="c[2]" :key="i"
+                    >{{ `${index + 1}-${i + 1}. ${c[1]}` }}
+                    <span class="title-tag" v-if="c[3]">
+                      {{ c[3] }}
                     </span>
                   </router-link>
                 </template>
@@ -56,8 +54,8 @@
                     :key="`${index + 1}-${i + 1}-${ii + 1}`"
                   >
                     {{ `${index + 1}-${i + 1}-${ii + 1}. ${cc[1]}` }}
-                    <span class="title-tag" v-if="getTitleTag(cc[2])">
-                      {{ getTitleTag(cc[2]) }}
+                    <span class="title-tag" v-if="cc[3]">
+                      {{ cc[3] }}
                     </span>
                   </router-link>
                 </div>
@@ -88,19 +86,6 @@ export default {
     }
   },
   methods: {
-    /**
-     * 获取标题标记
-     */
-    getTitleTag(path){
-      const pages = this.$site.pages;
-      for (let i = 0; i < pages.length; i++) {
-        let titleTag = pages[i].frontmatter.titleTag
-        if(pages[i].path === path && titleTag !== undefined){
-          return titleTag;
-        }
-      }
-      return false;
-    },
     getPageData() {
       const pageComponent = this.$frontmatter.pageComponent
       if (pageComponent && pageComponent.data) {

diff --git a/vdoing/node_utils/getSidebarData.js b/vdoing/node_utils/getSidebarData.js
@@ -86,11 +86,15 @@ function mapTocToPostSidebar(root) {
 
     const contentStr = fs.readFileSync(file, 'utf8') // 读取md文件内容，返回字符串
     const { data } = matter(contentStr, {}) // 解析出front matter数据
-    const permalink = data.permalink || ''
+    const { permalink = '', titleTag = '' } = data || {}
     if (data.title) {
       title = data.title
     }
-    postSidebar.push([filename, title, permalink]);  // [<路径>, <标题>, <永久链接>]
+    const item = [filename, title, permalink]
+    if (titleTag) {
+      item.push(titleTag)
+    }
+    postSidebar.push(item);  // [<路径>, <标题>, <永久链接>, <?标题标签>]
   })
 
   return postSidebar
@@ -136,7 +140,7 @@ function mapTocToSidebar(root, collapsable, prefix = '') {
       }
       const contentStr = fs.readFileSync(file, 'utf8') // 读取md文件内容，返回字符串
       const { data } = matter(contentStr, {}) // 解析出front matter数据
-      const permalink = data.permalink || ''
+      const { permalink = '', titleTag = '' } = data || {}
 
       // 目录页对应的永久链接，用于给面包屑提供链接
       const { pageComponent } = data
@@ -147,7 +151,9 @@ function mapTocToSidebar(root, collapsable, prefix = '') {
       if (data.title) {
         title = data.title
       }
-      sidebar[order] = [prefix + filename, title, permalink];  // [<路径>, <标题>, <永久链接>]
+      const item = [prefix + filename, title, permalink]
+      if (titleTag) item.push(titleTag)
+      sidebar[order] = item;  // [<路径>, <标题>, <永久链接>, <?标题标签>]
 
     }
   })