React の Synthetic Event

Reactに標準でついてくるEventオブジェクト Syntheticは合成という意味

ブラウザごとの差異を吸収してくれている

• SyntheticEvent – React

event pooling

なお、Reactにはevent poolingという仕組みがある シングルトンのSynthetic Eventをアプリ内で使いまわしている

なので、onClickなどのイベントハンドラの関数内でしか イベントオブジェクトへアクセスできないことになっている

たとえば以下のように、非同期でEventを触るコードはエラーになる

function clickHandler(event) {
  this.setState({ foo: 'bar' }, () => {
    console.log(event.target.value); // error
  });
}