Docs
useIsomorphicLayoutEffect
Custom hook that uses either useLayoutEffect or useEffect based on the environment (client-side or server-side).
Installation
pnpm dlx shadcn@latest add https://usekit.kiron.dev/k/use-isomorphic-layout-effect
Usage
"use client"
import { useIsomorphicLayoutEffect } from "@/hooks/isomorphic-layout-effect"
export function Component() {
useIsomorphicLayoutEffect(() => {
console.log(
"In the browser, I'm an `useLayoutEffect`, but in SSR, I'm an `useEffect`."
)
}, [])
return <p>Hello, world</p>
}
API Reference
Parameters
Name | Type | Description | Default Value | Optional |
---|---|---|---|---|
effect | EffectCallback | The effect function to be executed. | - | No |
deps | DependencyList | The dependencies of the effect. | undefined | Yes |
Return Values
Name | Type | Description |
---|---|---|
Function | void | - |