Reactでモーダルの背面スクロールをさせない制御

import { useEffect } from 'react'

export const useScrollLock = (isModalShow: boolean) => {
  if (typeof document === 'undefined') return

  const body = document.querySelector('body')

  useEffect(() => {
    if (body === null) return
    body.style.overflow = isModalShow ? 'hidden' : ''

    return () => {
      body.style.overflow = ''
    }
  }, [isModalShow])
}