← Snippets

useHasMounted()

function useHasMounted() {
  const [hasMounted, setHasMounted] = React.useState(false)

  React.useEffect(() => {
    setHasMounted(true)
  }, [])

  return hasMounted
}

// Usage
const SomeClientSideOnlyComponent = () => {
  const hasMounted = useHasMounted()
  if (!hasMounted) return null
  return <>Client only!</>
}
Discuss on Twitter