イベントハンドラにイベントオブジェクトと引数を同時に渡すとき #JavaScript

この記事の背景

ReactNativeを使っていたのですが、onPressを使用するときにイベントバブリングを解消する必要がありました。
そのため、イベントオブジェクトとイベントリスナの引数を渡そうとしたのですが、、

イベントオブジェクトと引数を同時に渡すにはどう記述したら良いのかわからない　...業務上TypeScriptで書く必要がある...

という状態になり、何となく日本語の記事が少ないと感じたため少しだけメモします。。

eについて少しだけメモ

イベントハンドラにeやeventといった引数を渡しているところを見たことがあると思います。
このeやeventのことをイベントオブジェクトといいます。このeには関数が含まれており、イベントの追加機能や情報を提供する目的でイベントハンドラーに自動的に渡されます。

つまり何かしらのユーザーの動作(クリックするとかタップするとか)でどのような動作を起こすのかがデフォルトで決まっているんです。それを抑制したり指定したりすることができます。

イベントオブジェクトと普通の引数を同時に渡す

結論、二つの書き方があり、ES6では下のような書き方もできるそうです。

EventHandler = (e: EventType, variable :string) => {
   e.preventDefault();  
   console.log(variable)
}
.
.
.
<div onClick={(e) => EventHandler(variable)}>pass variable and event object</div>

EventHandler =  (variable: string) = (e: EventType)=> {
   e.preventDefault();  
   console.log(variable)
}
.
.
.
<div onClick={EventHandler(variable)}>pass variable and event object(ES6)</div>

EventTypeにはonClickやonPressなどどのイベントリスナを使うかで変わってきてしまうのでそのイベントリスナに合った型を入れてください！

何か違う点などありましたら遠慮なくコメントで教えていただけると幸いです！