問題

Reactアプリにdivがあり、クリックとタッチの両方を処理する必要があります。ただし、モバイルをタップすると、両方のイベントが発生します。

モバイルでスワイプするか、通常のブラウザをクリックすると正常に動作し、各ケースで1つのイベントしか発生しません。

このタップの問題を処理して両方のイベントを発生させないにはどうすればよいですか?

 <div
  className={myClasses}
  onClick={this.myHandle}
  onTouchStart={this.myHandle}
  >&nbsp;
</div>
 

  ベストアンサー

touchとmouseの間で同様のイベントを使用してこの問題を解決しました。 touchstart/mouseDownまたはtouchEnd/mouseUp。各状況に応じて、どちらか一方を起動します。

 <div
  className={myClasses}
  onMouseUp={this.myHandle}
  onTouchEnd={this.myHandle}
  >&nbsp;
</div>
 

  同じタグがついた質問を見る

javascriptreactjs