Untitled
unknown
javascript
2 years ago
646 B
4
Indexable
import React from 'react'; export function App() { const [isOpen, setIsOpen] = React.useState(false); const popUpRef = React.useRef(); React.useEffect(() => { if (isOpen) { popUpRef.current.focus(); } }, [isOpen]); return ( <div className='App'> <button onClick={() =>setIsOpen(true)} > click me </button> {isOpen && ( <div tabIndex={-1} ref={popUpRef} onBlur={() => setIsOpen(false)} className='pop-up' > Hi i'm a beautifull pop-up </div> )} </div> ); }
Editor is loading...