onClickCaptureを使えば、イベント伝搬のうちのキャプチャリングフェーズで実行される関数を指定できることを知った
キャプチャリングフェーズとは、ルート要素からクリックされた要素に向かってイベントが伝播し、それぞれの要素にイベントリスナ・イベントハンドラが登録されているかどうかを調べるフェーズで、登録されていれば実行される
ちなみに、キャプチャリングフェーズの他に、クリックされた要素に到達した時のターゲットフェーズ、クリックされた要素からルートに向かって伝搬するフェーズのバブリングフェーズがある
参考:React・JavaScriptのイベント伝播について今更ながらに理解したのでまとめる
つまり、onClickなどで指定したイベントハンドラを実行する前に実行したいイベントハンドラは、onClickCaptureで指定するのが良い
ちなみに、Reactではv16 -> v17の時に、ドキュメントルート要素からクリックされた要素に向かってイベントが伝播していたものから、ReactDOM.render(<App />, rootNode);
のrootNodeに当たる要素からの伝搬に変わったみたい