[解決済み] React onClick と preventDefault() リンクのリフレッシュ/リダイレクト？

質問

reactでリンクをレンダリングしています。

render: ->
  `<a className="upvotes" onClick={this.upvote}>upvote</a>`

そして、上記にはアップヴォート機能があります。

upvote: ->
  // do stuff (ajax)

リンクの前はその場所にスパンを置いていたのですが、リンクに切り替える必要があり、ここで問題が発生しました。 .upvotes をクリックするたびに、ページがリフレッシュされてしまうのです。

event.preventDefault() - 動作しません。

upvote: (e) ->
  e.preventDefault()
  // do stuff (ajax)

event.stopPropagation() - 動作しません。

upvote: (e) ->
  e.stopPropagation()
  // do stuff (ajax)

return false - 動作しません。

upvote: (e) ->
  // do stuff (ajax)
  return false

私はまた、私のindex.htmlでjQueryを使用して上記のすべてを試してみましたが、何も動作しないようです。ここでどうすればいいのか、何が間違っているのか？event.typeを確認したところ、それは click であるため、私は何とかしてリダイレクトを回避することができるはずだと思います？

すみません、Reactに関しては初心者なんです。

ありがとうございます！

どのように解決するのですか？

Reactのイベントは、実はNative Eventではなく、Synthetic Eventです。そのため はこちら :

イベントのデリゲーション React は実際にはイベントハンドラをノード自体にアタッチしません。React が起動すると、単一のイベント リスナーを使用してトップ レベルですべてのイベントのリッスンを開始します。コンポーネントがマウントまたはアンマウントされると、イベントハンドラは単に内部マッピングから追加または削除されます。イベントが発生すると、React はこのマッピングを使用してイベントをディスパッチする方法を知っています。マッピングにイベントハンドラが残っていない場合、Reactのイベントハンドラは単純なno-opsになります。

を使ってみる Use Event.stopImmediatePropagation :

upvote: (e) ->
  e.stopPropagation();
  e.nativeEvent.stopImmediatePropagation();