속성 'dataset'이(가) 'EventTarget' 유형에 없습니다.

속성 'dataset'이(가) 'EventTarget' 유형에 없습니다.

클릭 후 버튼에서 데이터 세트에 액세스하려고 하면 이^ 오류가 발생합니다.

linkProvider = (ev: React.SyntheticEvent<EventTarget>) => {
  console.debug('ev.target', ev.target.dataset['ix']) // error
}

// in render 
providers.map((provider, ix) => (
  <button key={provider} data-ix={ix} onClick={this.linkProvider}>{provider}</button>
))

어떻게 하면 잘 될 수 있을까요?

문제는 여기에 있습니다.Element,document,그리고.window될 수 있습니다. 당신은 당신의 것을 감지해야 합니다.EventTarget요소인 경우.그래서 당신의 경우 아래 코드가 작동해야 합니다.

linkProvider = (ev: React.SyntheticEvent<EventTarget>) => {
  // If event target not an HTMLButtonElement, exit
  if (!(ev.target instanceof HTMLButtonElement)) {
    return;
  }
  console.debug('ev.target', ev.target.dataset['ix']) 
}

단도직입적으로

linkProvider = (ev: React.SyntheticEvent<HTMLButtonElement>) => {
  console.debug('ev.target', ev.currentTarget.dataset['ix']) 
}

그리고 여기에 예를 추가했습니다.

@Efe와 @fatemefazli가 제공한 두 가지 제안을 결합하여, 저는 다음과 같은 효과가 있는 솔루션에 도달했습니다.

참고로, 이 인터페이스는 인터페이스와 함께 작동하지 않는 이유입니다.target(허브 링크)

interface SyntheticEvent<T> {
    /**
     * A reference to the element on which the event listener is registered.
     */
    currentTarget: EventTarget & T;

    // If you thought this should be `EventTarget & T`, see https://github.com/DefinitelyTyped/DefinitelyTyped/pull/12239
    /**
     * A reference to the element from which the event was originally dispatched.
     * This might be a child element to the element on which the event listener is registered.
     *
     * @see currentTarget
     */
    target: EventTarget;

    // ...
}

Efe의 답변에 추가할 수 있다면,

부동산을 확인하는 것도 말이 된다고 생각합니다.dataset을 가지고 있습니다.ix속성을 사용하기 전에*:

linkProvider = (ev: React.SyntheticEvent<EventTarget>) => {
  if (!(ev.target instanceof HTMLButtonElement)) {
    return;
  }

  if (ev.target.dataset.ix) {
    /// event handler logic
  }

  
}

*전면 교육 과정에서 얻은 예제

언급URL : https://stackoverflow.com/questions/49631688/property-dataset-does-not-exist-on-type-eventtarget