修改

src/hooks/useMobile.ts

@@ -0,0 +1,29 @@
+import { useEffect, useState } from 'react'
+
+export function useIsMobile(breakpoint = 768) {
+  const [isMobile, setIsMobile] = useState<boolean>(() => {
+    if (typeof window === 'undefined') return false
+    return window.innerWidth < breakpoint
+  })
+
+  useEffect(() => {
+    if (typeof window === 'undefined') return
+
+    const mql = window.matchMedia(`(max-width: ${breakpoint - 0.02}px)`)
+    const onChange = (e: MediaQueryListEvent) => {
+      setIsMobile(e.matches)
+    }
+
+    setIsMobile(mql.matches)
+
+    if (mql.addEventListener) {
+      mql.addEventListener('change', onChange)
+      return () => mql.removeEventListener('change', onChange)
+    } else {
+      mql.addListener(onChange)
+      return () => mql.removeListener(onChange)
+    }
+  }, [breakpoint])
+
+  return isMobile
+}