封装isBroswer()

components/NotionPage.js

@@ -2,6 +2,7 @@ import { NotionRenderer } from 'react-notion-x'
 import dynamic from 'next/dynamic'
 import mediumZoom from 'medium-zoom'
 import React from 'react'
+import { isBrowser } from '@/lib/utils'
 
 const Code = dynamic(() =>
   import('react-notion-x/build/third-party/code').then((m) => m.Code), { ssr: false }
@@ -27,7 +28,7 @@ const NotionPage = ({ post }) => {
     return <>{post?.summary || ''}</>
   }
 
-  const zoom = typeof window !== 'undefined' && mediumZoom({
+  const zoom = isBrowser() && mediumZoom({
     container: '.notion-viewport',
     background: 'rgba(0, 0, 0, 0.2)',
     margin: getMediumZoomMargin()
@@ -39,7 +40,7 @@ const NotionPage = ({ post }) => {
     addWatch4Dom()
   }, [])
   setTimeout(() => {
-    if (typeof document !== 'undefined') {
+    if (isBrowser()) {
       // 将相册gallery下的图片加入放大功能
       const imgList = document.querySelectorAll('.notion-collection-card-cover img')
       if (imgList && zoomRef.current) {

components/SideBarDrawer.js

@@ -24,22 +24,20 @@ const SideBarDrawer = ({ children, isOpen, onOpen, onClose, className }) => {
 
   // 点击按钮更改侧边抽屉状态
   const switchSideDrawerVisible = (showStatus) => {
-    if (window) {
-      if (showStatus) {
-        onOpen()
-      } else {
-        onClose()
-      }
-      const sideBarDrawer = window.document.getElementById('sidebar-drawer')
-      const sideBarDrawerBackground = window.document.getElementById('sidebar-drawer-background')
+    if (showStatus) {
+      onOpen()
+    } else {
+      onClose()
+    }
+    const sideBarDrawer = window.document.getElementById('sidebar-drawer')
+    const sideBarDrawerBackground = window.document.getElementById('sidebar-drawer-background')
 
-      if (showStatus) {
-        sideBarDrawer.classList.replace('-ml-80', 'ml-0')
-        sideBarDrawerBackground.classList.replace('hidden', 'block')
-      } else {
-        sideBarDrawer.classList.replace('ml-0', '-ml-80')
-        sideBarDrawerBackground.classList.replace('block', 'hidden')
-      }
+    if (showStatus) {
+      sideBarDrawer.classList.replace('-ml-80', 'ml-0')
+      sideBarDrawerBackground.classList.replace('hidden', 'block')
+    } else {
+      sideBarDrawer.classList.replace('ml-0', '-ml-80')
+      sideBarDrawerBackground.classList.replace('block', 'hidden')
     }
   }