Hexo 主题搜索调整

pages/search/[keyword].js

@@ -4,6 +4,11 @@ import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import { getDataFromCache } from '@/lib/cache/cache_manager'
 
+/**
+ * 服务端搜索
+ * @param {*} param0
+ * @returns
+ */
 export async function getServerSideProps ({ params: { keyword } }) {
   const {
     allPosts,

pages/search/index.js

@@ -4,6 +4,9 @@ import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import { useRouter } from 'next/router'
 
+/**
+ * 浏览器前端搜索
+ */
 export async function getStaticProps () {
   const {
     allPosts,

themes/Hexo/LayoutSearch.js

@@ -1,9 +1,26 @@
 
+import { useRouter } from 'next/router'
+import { useEffect } from 'react'
 import BlogPostListPage from './components/BlogPostListPage'
 import LayoutBase from './LayoutBase'
 
 export const LayoutSearch = (props) => {
-  return <LayoutBase {...props}>
-    <BlogPostListPage {...props}/>
+  const { keyword } = props
+  const router = useRouter()
+  const currentSearch = keyword || router?.query?.s
+  useEffect(() => {
+    setTimeout(() => {
+      const container = document.getElementById('container')
+      if (container && container.innerHTML) {
+        const re = new RegExp(`${currentSearch}`, 'gim')
+        container.innerHTML = container.innerHTML.replace(re, `<span class='text-red-500 border-b border-dashed'>${currentSearch}</span>`)
+      }
+    },
+    100)
+  })
+  return <LayoutBase {...props} currentSearch={currentSearch}>
+    <div ic='container'>
+      <BlogPostListPage {...props}/>
+    </div>
   </LayoutBase>
 }

themes/Hexo/components/SideRight.js

@@ -45,7 +45,7 @@ export default function SideRight (props) {
       </Card>
       <Card>
         <MenuButtonGroup {...props}/>
-        <SearchInput />
+        <SearchInput {...props}/>
       </Card>
       <Card>
         <div className='ml-2 mb-3 font-sans'>