reactjs - TS2339: ไม่มีคุณสมบัติ 'closest' ในประเภท 'EventTarget' - ทำอย่างไรฉันถึงจะได้ event.target แบบ native ใน React?
ฉันกำลังพยายามสร้าง callback ของ event listener ที่ตรวจสอบว่ามันถูกเรียกจากที่ไหน คล้ายกับนี้:
import { TouchEvent } from 'react'
const isInvokedFromInsideContainer = (event: TouchEvent<HTMLElement>) => {
parentContainer = event.target.closest('#container')
console.log('isInvokedFromInsideContainer: ' + !!parentContainer)
}
แต่ฉันได้รับ
TS2339: คุณสมบัติ 'closest' ไม่มีอยู่ในประเภท 'EventTarget'
event.nativeEvent.target.closest ก็ไม่ทำงานเช่นกัน
event.currentTarget.closest ทำงาน แต่ชัดเจนว่าฉันไม่ต้องการแบบนั้น
การแปลง target เป็น HTMLElement ใช้งานได้:
const target = (event.target as HTMLElement)
const parentContainer = target.closest('#container')
วิธีที่ถูกต้องในการทำสิ่งนี้คืออะไร?
คำตอบ #1
ฉันแก้ไขข้อผิดพลาดนี้โดยการแปลง event.target ให้เป็น HTMLElement โดยตรง
ดังนั้นในกรณีของคุณ:
...
parentContainer = (event.target as HTMLElement).closest('#container')
...
คำตอบ #2
คุณสามารถทำให้ Typescript เข้าใจว่าเป้าหมายเป็นชนิดใดโดยการระบุตัวสร้างของมัน:
if (event.target instanceof HTMLElement) {
const container = event.target.closest('#container')
}
