イベントプーリング

補足

このページの内容は React 16 以前および React Native にのみ関連します。

ウェブで使う React 17 ではイベントプーリングは使用されていません。

React 17 におけるこの変更についての詳細はこちら。

SyntheticEvent オブジェクトはプールされます。つまり SyntheticEvent はイベントハンドラが呼び出された後に再利用され、すべてのプロパティが null にセットされます。例えば、以下は動作しません：

function handleChange(e) {
  // This won't work because the event object gets reused.
  setTimeout(() => {
    console.log(e.target.value); // Too late!
  }, 100);
}

イベントハンドラが実行された後にオブジェクトのプロパティにアクセスする必要がある場合は、e.persist() を呼ぶ必要があります：

function handleChange(e) {
  // Prevents React from resetting its properties:
  e.persist();

  setTimeout(() => {
    console.log(e.target.value); // Works
  }, 100);
}

Is this page useful?このページを編集する