react クリックした要素の座標位置を取得する

Question

前提・実現したいこと

react.jsを利用してクリックした要素の
x座標,y座標を取得したい。

発生している問題・エラーメッセージ

TypeError: e.getBoundingClientRect is not a function

該当のソースコード

clickButton(e) {
  console.log(e.getBoundingClientRect().top);//←ブラウザ上のx,y位置を取得したい
  console.log(e.clientX,e.clientY);//←マウス座標は取得できている
}

reunder() {
return(
<div id="btn" onClick={this.clickButton.bind(this)}>btn</div>
);
}

どのようにすれば取得できますでしょうか？

Answer 1

eはイベントオブジェクトなので、直接getBoundingClientRectを取ることはできません。e.target.getBoundingClientRectとする必要があるかと思います。

Answer 2

「e.target.getBoundingClientRect()」ではだめですかね？

Comments

[cheche0830]

あ・・・targetですね・・・できました！！
ありがとうございます！！