#
useClickOutside
The useClickOutside
hook is a custom React hook designed to invoke a callback when a click event occurs outside a specified element.
#
Usage
import { useClickOutside } from "hookverse";
const elementRef = useClickOutside(callbackFun);
#
Parameters
#
API
#
elementRef
A React RefObject
that should be assigned to the HTML element for which you want to detect clicks outside.
#
Example
import React, { useRef } from "react";
import { useClickOutside } from "hookverse";
const ClickOutsideExample = () => {
const handleClickOutside = () => {
// Your callback function
console.log("Clicked outside the specified element");
};
const elementRef = useClickOutside(handleClickOutside);
return (
<div>
<p>Click outside this element to trigger the callback</p>
<div ref={elementRef}>{/* Your content */}</div>
</div>
);
};
export default ClickOutsideExample;
In this example, the useClickOutside
hook is utilized to detect clicks outside a specified element, triggering the provided callback function.