diff --git a/themes/plog/components/Modal.js b/themes/plog/components/Modal.js index 8c490093..17ae4da6 100644 --- a/themes/plog/components/Modal.js +++ b/themes/plog/components/Modal.js @@ -34,7 +34,7 @@ export default function Modal(props) { // 修改当前显示的遮罩内容 function prev() { setLoading(true) - const index = posts.findIndex(post => post.slug === modalContent.slug) + const index = posts?.findIndex(post => post.slug === modalContent.slug) if (index === 0) { setModalContent(posts[posts.length - 1]) } else { @@ -90,10 +90,11 @@ export default function Modal(props) { {!loading && (<>
-
-

{modalContent?.title}

-
- + +
+

{modalContent?.title}

+
+
{modalContent?.summary} diff --git a/themes/plog/index.js b/themes/plog/index.js index 07d34068..80bad683 100644 --- a/themes/plog/index.js +++ b/themes/plog/index.js @@ -21,6 +21,7 @@ import Modal from './components/Modal' import { Style } from './style' import replaceSearchResult from '@/components/Mark' import CommonHead from '@/components/CommonHead' +import { useRouter } from 'next/router' // 主题全局状态 const ThemeGlobalPlog = createContext() @@ -38,6 +39,20 @@ const LayoutBase = props => { const [showModal, setShowModal] = useState(false) const [modalContent, setModalContent] = useState(null) + // 页面切换关闭遮罩 + const router = useRouter() + const closeModal = ()=>{ + setShowModal(false) + } + + useEffect(() => { + router.events.on('routeChangeComplete', closeModal) + return () => { + router.events.off('routeChangeComplete', closeModal) + } + }, [router.events]) + + return (