Introducing PrimeReact v11-alpha 🎉Discover Now

useMounted

SSR-safe flag that flips to true once the component mounts on the client.

Usage#

import { useMounted } from '@primereact/hooks/use-mounted';
const mounted = useMounted();
 
if (!mounted) return null;
 
return <ClientOnlyContent />;

Useful when you need to gate content that depends on browser APIs without causing a hydration mismatch.

Options#

useMounted({
    onMounted: () => console.log('mounted'),
    onUnmounted: () => console.log('unmounted')
});

Both callbacks are optional.

Signature#

function useMounted(options?: { onMounted?: () => void; onUnmounted?: () => void }): boolean;