refactor: get post data

use mixin(post)

Author: reco_luan

components/Common.vue

@@ -169,10 +169,6 @@ export default {
     }
   },
 
-  created () {
-    this._getPostData()
-  },
-
   mounted () {
     this.$router.afterEach(() => {
       this.isSidebarOpen = false

components/HomeBlog.vue

@@ -11,13 +11,13 @@
       <div class="blog-list">
         <!-- 博客列表 -->
         <note-abstract
-          :data="$themeConfig.posts"
+          :data="$recoPosts"
           :hideAccessNumber="true"
           :currentPage="currentPage"></note-abstract>
         <!-- 分页 -->
         <pagation
           class="pagation"
-          :total="$themeConfig.posts.length"
+          :total="$recoPosts.length"
           :currentPage="currentPage"
           @getCurrentPage="getCurrentPage" />
       </div>
@@ -26,7 +26,7 @@
         <h3 class="name" v-if="$themeConfig.author || $site.title">{{ $themeConfig.author || $site.title }}</h3>
         <div class="num">
           <div>
-            <h3>{{$themeConfig.posts.length}}</h3>
+            <h3>{{$recoPosts.length}}</h3>
             <h6>文章</h6>
           </div>
           <div>

enhanceApp.js

@@ -0,0 +1,7 @@
+import postMixin from '@theme/mixins/posts'
+
+export default ({
+  Vue
+}) => {
+  Vue.mixin(postMixin)
+}

helpers/postData.js

@@ -0,0 +1,28 @@
+import { compareTime } from '@theme/util'
+
+// 过滤博客数据
+export function filterPostData (posts, isTimeline) {
+  posts = posts.filter(item => {
+    const { title, frontmatter: { home, date, publish }} = item
+    return isTimeline === true
+      ? !(home == true || title == undefined || date === undefined || publish === false)
+      : !(home == true || title == undefined || publish === false)
+  })
+  return posts
+}
+
+// 排序博客数据
+export function sortPostData (posts) {
+  posts.sort((a, b) => {
+    const aSticky = a.frontmatter.sticky
+    const bSticky = b.frontmatter.sticky
+    if (aSticky && bSticky) {
+      return aSticky == bSticky ? compareTime(a, b) : (aSticky - bSticky)
+    } else if (aSticky && !bSticky) {
+      return -1
+    } else if (!aSticky && bSticky) {
+      return 1
+    }
+    return compareTime(a, b)
+  })
+}

layouts/Category.vue

@@ -37,6 +37,7 @@
 import Common from '@theme/components/Common.vue'
 import NoteAbstract from '@theme/components/NoteAbstract.vue'
 import mixin from '@theme/mixins/index.js'
+import { sortPostData, filterPostData } from '@theme/helpers/postData'
 
 export default {
   mixins: [mixin],
@@ -54,8 +55,8 @@ export default {
     // 时间降序后的博客列表
     posts () {
       let posts = this.$currentCategories.pages
-      posts = this._filterPostData(posts)
-      this._sortPostData(posts)
+      posts = filterPostData(posts)
+      sortPostData(posts)
       return posts
     },
     // 标题只显示分类名称
@@ -85,10 +86,6 @@ export default {
       this.currentPage = page
       this.$page.currentPage = page
       this._setStoragePage(page)
-    },
-    // 获取时间的数字类型
-    _getTimeNum (date) {
-      return parseInt(new Date(date.frontmatter.date).getTime())
     }
   },
 

layouts/Tag.vue

@@ -27,6 +27,7 @@ import Common from '@theme/components/Common.vue'
 import NoteAbstract from '@theme/components/NoteAbstract.vue'
 import TagList from '@theme/components/TagList.vue'
 import mixin from '@theme/mixins/index.js'
+import { sortPostData, filterPostData } from '@theme/helpers/postData'
 
 export default {
   mixins: [mixin],
@@ -45,8 +46,8 @@ export default {
     // 时间降序后的博客列表
     posts () {
       let posts = this.$currentTags.pages
-      posts = this._filterPostData(posts)
-      this._sortPostData(posts)
+      posts = filterPostData(posts)
+      sortPostData(posts)
       return posts
     }
   },

layouts/Tags.vue

@@ -4,14 +4,14 @@
       <TagList :currentTag="currentTag" @getCurrentTag="tagClick"></TagList>
       <note-abstract
         class="list"
-        :data="posts"
+        :data="$recoPosts"
         :currentPage="currentPage"
         :currentTag="currentTag"
         @currentTag="getCurrentTag"></note-abstract>
 
       <pagation
         class="pagation"
-        :total="posts.length"
+        :total="$recoPosts.length"
         :currentPage="currentPage"
         @getCurrentPage="getCurrentPage"></pagation>
     </Common>
@@ -36,12 +36,6 @@ export default {
       allTagName: '全部'
     }
   },
-  computed: {
-    // 时间降序后的博客列表
-    posts () {
-      return this.$themeConfig.posts || this.$site.pages
-    }
-  },
 
   created () {
     if (this.$tags.list.length > 0) {

layouts/TimeLines.vue

@@ -21,6 +21,7 @@
 <script>
 import Common from '@theme/components/Common.vue'
 import mixin from '@theme/mixins/index.js'
+import { filterPostData, sortPostData } from '@theme/helpers/postData'
 
 export default {
   mixins: [mixin],
@@ -55,7 +56,7 @@ export default {
     getPages (tag) {
       let pages = this.$site.pages
       // 时间轴不进行制定处理
-      pages = this._filterPostData(pages, true)
+      pages = filterPostData(pages, true)
       // reverse()是为了按时间最近排序排序
       this.pages = pages.length == 0 ? [] : pages
       for (let i = 0, length = pages.length; i < length; i++) {
@@ -69,7 +70,7 @@ export default {
 
       for (const key in this.formatPages) {
         const data = this.formatPages[key]
-        this._sortPostData(data)
+        sortPostData(data)
         this.formatPagesArr.unshift({
           year: key,
           data
@@ -93,10 +94,6 @@ export default {
     // 跳转
     go (url) {
       this.$router.push({ path: url })
-    },
-    // 获取时间的数字类型
-    _getTimeNum (date) {
-      return parseInt(new Date(date.frontmatter.date).getTime())
     }
   }
 }

mixins/index.js

@@ -5,59 +5,10 @@ export default {
       const index = Math.floor(Math.random() * tagColorArr.length)
       return tagColorArr[index]
     },
-    _filterPostData (posts, isTimeline) {
-      posts = posts.filter(item => {
-        const { title, frontmatter: { home, date, publish }} = item
-        return isTimeline === true
-          ? !(home == true || title == undefined || date === undefined || publish === false)
-          : !(home == true || title == undefined || publish === false)
-      })
-      return posts
-    },
-    _sortPostData (posts) {
-      posts.sort((a, b) => {
-        const aSticky = a.frontmatter.sticky
-        const bSticky = b.frontmatter.sticky
-        if (aSticky && bSticky) {
-          return aSticky == bSticky ? this._compareTime(a, b) : (aSticky - bSticky)
-        } else if (aSticky && !bSticky) {
-          return -1
-        } else if (!aSticky && bSticky) {
-          return 1
-        }
-        return this._compareTime(a, b)
-      })
-    },
     // 获取时间的数字类型
     _getTimeNum (date) {
       return parseInt(new Date(date.frontmatter.date).getTime())
     },
-    // 比对时间
-    _compareTime (a, b) {
-      return this._getTimeNum(b) - this._getTimeNum(a)
-    },
-    // 获取博客数据
-    _getPostData () {
-      return new Promise(resolve => {
-        if (!this.$themeConfig.posts) {
-          const {
-            $categories: { list: articles },
-            _filterPostData,
-            _sortPostData
-          } = this
-
-          let posts = articles.reduce((allData, currnetData) => {
-            return [...allData, ...currnetData.pages]
-          }, [])
-
-          posts = _filterPostData(posts)
-          _sortPostData(posts)
-
-          this.$themeConfig.posts = posts
-          resolve(posts)
-        }
-      })
-    },
     // 获取当前页码
     _getStoragePage () {
       const path = window.location.pathname
@@ -76,4 +27,4 @@ export default {
       sessionStorage.setItem('currentPage', JSON.stringify({ page, path }))
     }
   }
-}
+}

mixins/posts.js

@@ -0,0 +1,20 @@
+import { filterPostData, sortPostData } from '../helpers/postData'
+
+export default {
+  computed: {
+    $recoPosts () {
+      const {
+        $categories: { list: articles }
+      } = this
+
+      let posts = articles.reduce((allData, currnetData) => {
+        return [...allData, ...currnetData.pages]
+      }, [])
+
+      posts = filterPostData(posts)
+      sortPostData(posts)
+
+      return posts
+    }
+  }
+}