Learn more about Mintlify
Enter your email to receive updates about new features and product releases.
Indicates whether the current render is the component’s first render
true only during the first render, and false for all subsequent renders.
import { useIsFirstRender } from '@kuzenbo/hooks';
import { useState } from 'react';
function Demo() {
const isFirstRender = useIsFirstRender();
const [count, setCount] = useState(0);
return (
<div>
<p>Is first render: {isFirstRender ? 'Yes' : 'No'}</p>
<p>Count: {count}</p>
<button onClick={() => setCount(count + 1)}>Increment</button>
</div>
);
}
import { useIsFirstRender } from '@kuzenbo/hooks';
import { useState } from 'react';
function Demo() {
const isFirstRender = useIsFirstRender();
const [value, setValue] = useState('');
if (isFirstRender) {
console.log('Component mounted');
} else {
console.log('Component re-rendered');
}
return <input value={value} onChange={(e) => setValue(e.target.value)} />;
}
function useIsFirstRender(): boolean
true during the first render, false for all subsequent renders