React의 mouseEvent에 오프셋 X/오프셋이 없습니다.y

React의 mouseEvent에 오프셋 X/오프셋이 없습니다.y

요소를 기준으로 클릭 위치를 얻으려고 하는데 이벤트에 오프셋 X가 없습니다.

onClick(e) {
  console.log(e.offsetX) // returns undefined
  console.log(e.target.offsetX) // returns undefined
}

render() {
  return <img src='http://placehold.it/1000x500' onClick={this.onClick} />
}

요소에서 클릭 위치를 얻으려면 어떻게 해야 합니까?

아, 그렇군요.로부터 알 수 있다.e.nativeEvent.offsetX올바른 접근법인가?

evt.nativeEvent.offsetX로 인해 컴포넌트가 자주 깜박이는 문제가 발생하며 약간 이상하다는 것을 알게 되었습니다.디버깅은 아직 완료하지 않았지만 사용으로 전환했습니다.

상위 컨테이너에서 React.createRef 또는 React.useRef를 사용한 후 event.clientX - ref.current.getBoundingClientRect()를 사용하여 이 방법이 더 효과적이라는 것을 알게 되었습니다.

언급URL : https://stackoverflow.com/questions/31519758/reacts-mouseevent-doesnt-have-offsetx-offsety