TypeScript: ev.target и Node.contains: EventTarget нельзя назначить узлу

Question

Вот код:

function bodyClickHandler(ev: MouseEvent) {
    if(containerRef.current && containerRef.current.contains(ev.target)) return;
    setOpen(false);
}

Ошибка:

Аргумент типа 'EventTarget | null 'нельзя назначить параметру типа' Node | значение NULL'. Типу EventTarget не хватает следующих свойств типа Node: baseURI, childNodes, firstChild, isConnected и еще 44.ts (2345)

containerRef.current - это HTMLDivElement. .contains должна быть эта функция .

Разве ev.target не гарантированно будет Node в некотором роде?

Я могу разыграть ее (ev.target as Node) но я пытаюсь выяснить, по какому сценарию это может провалиться? Что я могу нажать на это не узел?

Answer 1

Краткий ответ: Это из-за плохой печати с их стороны. Go вперед и разыграйте его.

Длинный ответ: причина этого в том, что если вы нажмете <svg /> внутри кнопки (например), event.target укажет на SVG, что не гарантируется быть кнопкой (очевидно). Только событие currentTarget указывает на элемент, на котором находится обработчик. Поэтому люди, которые сделали наборы React, решили, что они будут определять и currentTarget события как то, что button было в нашем примере, но дают никаких гарантий о target события, за исключением того, что это EventTarget. Поэтому вы застряли с необходимостью разыграть его. Это обсуждается в этом PR .