Skip to main content
Version: 5.7.2

useDocumentEventListener

About​

A react hook to an event listener to the document object

Installation​

npm install --save rooks

Importing the hook​

import { useDocumentEventListener } from "rooks";

Usage​

function Demo() {
const [myState, setMyState] = useState(0);

useDocumentEventListener("click", function () {
setMyState(myState + 1);
});

return (
<div className="App">
<h1>useDocumentEventListener Example</h1>
<br></br>
<h1>Clicked {myState} times</h1>
</div>
);
}

render(<Demo />);

Arguments​

ArgumentsTypeDescriptionDefault value
eventNamestringThe event to trackundefind
callbackfunctionThe callback to be called on eventundefined
conditionsobjectThe options to be passed to the event listener{}
isLayoutEffectbooleanShould it use layout effect. Defaults to falsefalse

Return​

No return value.


Codesandbox Examples​

Basic Usage​

Join Bhargav's discord server​

You can click on the floating discord icon at the bottom right of the screen and talk to us in our server.