xxxxxxxxxx
const Home = forwardRef(({ open, setOpen }, ref) => {
console.log(open);
return (
<section ref={ref}>
<h1>Feels good to be home!</h1>
<button className="secondary" onClick={() => setOpen(!open)}>
Dropdown Toggle
</button>
{open && (
<ul>
<li>One</li>
<li>Two</li>
</ul>
)}
</section>
);
});
xxxxxxxxxx
const accMenuRef = useRef<any>()
useEffect(() => {
let handler = (e : any)=>{
if(!accMenuRef.current.contains(e.target)){
setDropDown(false);
}
};
document.addEventListener("mousedown", handler);
return() =>{
document.removeEventListener("mousedown", handler);
}
});