Какой указать тип для event path на React?

Question

[hamster141095]

В общем, есть обычный handleClick на показ и скрытие меню, если клик не попадает на это меню. Не могу описать тип для event , который включает в себя path, MouseEvent не проходит ....

const [isVisiblePopup, setIsVisiblePopup] = useState(false);
  const mobileButtonsRef = useRef(null);
  const isTrainer = userRole === 'trainer'
  const handleOutsideClick = (event: MouseEvent) => {
    const path = event.path || (event.composedPath && event.composedPath());
    if (path && !path.includes(mobileButtonsRef.current)) {
         setIsVisiblePopup(false);
    }
  };

  useEffect(() => {
    document.body.addEventListener('click', handleOutsideClick);
    return () => {
        document.body.removeEventListener('click', handleOutsideClick);
    };
  }, []);

Property 'path' does not exist on type 'MouseEvent'

Answer 1

[Sun_Day]

Вероятно его туда не добавили по какой-то причине. Есть подозрение, что именно для того, чтобы вы его не использовали.
В мозиле отыскать его не удалось, но вот в хроме оно есть. Конечно можно написать обходной тип, но наверное не стоит использовать это свойство, если важна какая никакая кроссбраузерность.
А вот с функцией composedPath все впорядке.
https://developer.mozilla.org/en-US/docs/Web/API/E...

Но если прям необходимо, то как-то так:

type M = MouseEvent & {
    path: Node[];
}
  const handleOutsideClick = (event: M ) =>

Comments

[Vas]

здравствуйте, подскажите что значит Node[]. Это что-то типо затычки? чтобы пустое свойство не создавать? Почему называем так? Тип Node не нашел в TS при гуглении, объясните пожалуйста...)