部分提交tag分页

pages/index.js

@@ -23,33 +23,22 @@ export async function getStaticProps() {
   }
 
   // 处理分页
-  const page = 1
-  let postsToShow
-  if (BLOG.POST_LIST_STYLE !== 'page') {
-    postsToShow = Array.from(allPosts)
-  } else {
-    postsToShow = allPosts?.slice(
-      BLOG.POSTS_PER_PAGE * (page - 1),
-      BLOG.POSTS_PER_PAGE * page
-    )
-    if (BLOG.POST_LIST_PREVIEW === 'true') {
-      for (const i in postsToShow) {
-        const post = postsToShow[i]
-        if (post.password && post.password !== '') {
-          continue
-        }
-        const blockMap = await getPostBlocks(
-          post.id,
-          'slug',
-          BLOG.POST_PREVIEW_LINES
-        )
-        if (blockMap) {
-          post.blockMap = blockMap
-        }
+  if (BLOG.POST_LIST_STYLE === 'scroll') {
+    props.posts = Array.from(allPosts)
+  } else if (BLOG.POST_LIST_STYLE === 'page') {
+    props.posts = allPosts?.slice(0, BLOG.POSTS_PER_PAGE)
+  }
+
+  // 预览文章内容
+  if (BLOG.POST_LIST_PREVIEW === 'true') {
+    for (const i in props.posts) {
+      const post = props.posts[i]
+      if (post.password && post.password !== '') {
+        continue
       }
+      post.blockMap = await getPostBlocks(post.id, 'slug', BLOG.POST_PREVIEW_LINES)
     }
   }
-  props.posts = postsToShow
 
   return {
     props: {

pages/page/[page].js

@@ -41,24 +41,16 @@ export async function getStaticProps({ params: { page } }) {
   const { allPages } = props
   const allPosts = allPages.filter(page => page.type === 'Post' && page.status === 'Published')
   // 处理分页
-  props.posts = allPosts.slice(
-    BLOG.POSTS_PER_PAGE * (page - 1),
-    BLOG.POSTS_PER_PAGE * page
-  )
+  props.posts = allPosts.slice(BLOG.POSTS_PER_PAGE * (page - 1), BLOG.POSTS_PER_PAGE * page)
+
+  // 处理预览
   if (BLOG.POST_LIST_PREVIEW === 'true') {
     for (const i in props.posts) {
       const post = props.posts[i]
       if (post.password && post.password !== '') {
         continue
       }
-      const blockMap = await getPostBlocks(
-        post.id,
-        'slug',
-        BLOG.POST_PREVIEW_LINES
-      )
-      if (blockMap) {
-        post.blockMap = blockMap
-      }
+      post.blockMap = await getPostBlocks(post.id, 'slug', BLOG.POST_PREVIEW_LINES)
     }
   }
 

themes/hexo/LayoutTag.js

@@ -3,18 +3,43 @@ import BlogPostListScroll from './components/BlogPostListScroll'
 import BlogPostListPage from './components/BlogPostListPage'
 import LayoutBase from './LayoutBase'
 import TagItemMini from '../next/components/TagItemMini'
+import PaginationNumber from './PaginationNumber'
+import BlogPostListEmpty from './BlogPostListEmpty'
 
 export const LayoutTag = (props) => {
-  console.log(props)
-
   const currentTag = props.tags.find((t) => {
     return t.name === props.tag
   })
 
+  const totalPage = Math.ceil(props.postCount / BLOG.POSTS_PER_PAGE)
+  const showPagination = props.postCount >= BLOG.POSTS_PER_PAGE
+
+  props.headerSlot = <div className="cursor-pointer px-5 py-1 mb-2 font-light hover:underline hover:text-indigo-700 dark:hover:text-indigo-400 transform text-center dark:text-white">
+    <TagItemMini tag={currentTag}/>
+  </div>
+
+  // 空文章处理
+  if (!props.postToShow || props.postToShow.length === 0) {
+    return <LayoutBase {...props}> <BlogPostListEmpty/></LayoutBase>
+  }
+
+  const page = 1
   return <LayoutBase {...props}>
             <div className="cursor-pointer px-5 py-1 mb-2 font-light hover:underline hover:text-indigo-700 dark:hover:text-indigo-400 transform text-center dark:text-white">
-           <TagItemMini tag={currentTag}/>
-        </div>
-    {BLOG.POST_LIST_STYLE === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}
+                <TagItemMini tag={currentTag}/>
+            </div>
+
+            { props.postToShow && props.postToShow.length > 0
+              ? (<>
+                {BLOG.POST_LIST_STYLE === 'page'
+                  ? (<div id="container" className='w-full'>
+                        <BlogPostListPage {...props} />
+                        { showPagination && <PaginationNumber page={page} totalPage={totalPage} /> }
+                    </div>)
+                  : <BlogPostListScroll {...props} />}=
+              </>)
+              : (<BlogPostListEmpty/>)
+            }
+
    </LayoutBase>
 }

themes/hexo/components/PaginationNumber.js

@@ -62,14 +62,12 @@ const PaginationNumber = ({ page, totalPage }) => {
 function getPageElement(page, currentPage) {
   return (
     <Link href={page === 1 ? '/' : `/page/${page}`} key={page} passHref>
-      <a
-        className={
+      <a className={
           (page + '' === currentPage + ''
             ? 'font-bold bg-indigo-400 dark:bg-indigo-500 text-white '
             : 'border-b duration-500 border-indigo-300 hover:border-indigo-400 ') +
           ' border-white dark:border-indigo-700 dark:hover:border-indigo-400 cursor-pointer pb-0.5 w-6 text-center font-light hover:font-bold'
-        }
-      >
+        } >
         {page}
       </a>
     </Link>