同じイベントの繰り返し実行を避けるにはどうすればよいですか？私は、次の操作を行いうまくまで私の部品の仕事の

Question

イベント：オプションのメニューで、別のコンポーネントに ルータアクセスを通じてクリックして、画面の

1. 変更。
2. 私は元の コンポーネントに戻ります。

これを行うと、コンポーネントのイベントが重複しています。 たとえば、handleAddTaskイベントは、他のメニューオプションでクリックが行われた回数だけ実行されます。 他のモジュールへのルーティングを起動しないと、イベントは正常に機能し、重複しません。

Answer 1

コンポーネントがアンマウントされても、componentDidMountに添付されているイベントリスナーは消えないので、コンポーネントを再マウントするたびに新しいリスナーセットが取得されます。

Answer 2

このクリックが毎回リフレッシュ

代わりの結合をレンダリングバインドされますonClick={this.clickHandler.bind(this)}でconstructor

constructor() { 
    this.clickHandler = this.clickHandler.bind(this); 
} 

---

に結合

<div onClick={this.clickHandler.bind(this)} ... > 

使用のようなclickイベントを使用しないでください。レンダリング機能のイベントがそれをバインドしますcontructorにあります。