状態
同期状態でいいね機能を実装
そこから、非同期化
エラーもちらほらでましたが、エラーが出ないように修正。
エラーがなくなった、でも非同期でいいね機能が動かない。
って人は見てください。
同じようなパターンかもしれないです。
いいね機能を実装している方はたくさんいて
記事もたくさんありますので、自分と同じ状況を探してください。
詳しい詳細は下記を見てください。
https://teratail.com/questions/304798
非同期処理の流れをおさらい
Ajaxの流れ
①イベント発生
②非同期でリクエスト送信
③受け取った情報を処理
④処理結果をJSON形式で応答
⑤レスポンスを受けてDOMでページ更新
自分の状態を確認することで原因がどこか見つける作業が早くなる。
イベントを発生しているかの確認だったら、アラートを出すように記述して確かめるみたいな感じですね。
問題箇所
<tr class="idea_<%= @idea.id %>">
<%= render 'like', idea: @idea %>
</tr>
ここの記述が問題でした。
記事等を参考に書いていたのですが、tableタグを使用していないのにtrタグを使っていたのが原因でした。
タグの性質を理解せずに使っていたのが駄目だったわけですね。
まさかと、思いdivタグに変更したらすんなりできました。
今回得た教訓は、タグの性質を知ること！