react-useoutside-handler
v1.0.1
Published
This React hook allows you to detect clicks outside of a specified element.
Downloads
117
Maintainers
Readme
react-useoutside-handler
This React hook allows you to detect clicks outside of a specified element.
Installation
Install using NPM:
npm install react-useoutside-handler --save
Install using Yarn:
yarn add react-useoutside-handler
Usage
Import:
import useOutside from 'react-useoutside-handler';
useOutside:
useOutside(ref, handler);
Example:
import React, { useRef } from 'react';
import useOutside from 'react-useoutside-handler';
const HelloWorldComponent = () => {
const refHelloWorldElement = useRef(null);
useOutside(refHelloWorldElement, () => alert('You clicked outside of Hello world element'));
return (
<div>
<div ref={refHelloWorldElement} className="hello-world-element">Hello World</div>
</div>
);
};