Disabling click events outside of your popup

Cher - Oct 5 '19 - - Dev Community

Never inject an overlay div again (unless you want to 😉).

useLayoutEffect(
    () => {
      const {current: menuDOM} = menuRef;
      const body = window.document.querySelector('body');
      if (menuDOM && isOpen) {
        body.style['pointer-events'] = 'none';
        menuDOM.style['pointer-events'] = 'initial';
      } else if (menuDOM && !isOpen) {
        body.style['pointer-events'] = null;
        menuDOM.style['pointer-events'] = null;
      }
    },
    [isOpen]
  );
Enter fullscreen mode Exit fullscreen mode
. . . . . . . . .