いいねの解除ができない

Question

前提・実現したいこと

いいね機能を実装したくて、
この記事を参考に
いいね機能を実装しました

このアプリのgithub

発生している問題・エラーメッセージ

いいねボタンを押した時、いいねは上手く行くのですが、いいねの解除が上手くいきません

rails serverのログでは

Started DELETE "/like/19" for ::1 at 2020-12-23 16:56:49 +0900
Processing by LikesController#unlike as JS
  Parameters: {"drink_id"=>"19"}
  Drink Load (0.5ms)  SELECT `drinks`.* FROM `drinks` WHERE `drinks`.`id` = 19 LIMIT 1
  ↳ app/controllers/likes_controller.rb:21:in `set_variables'
  User Load (0.4ms)  SELECT `users`.* FROM `users` WHERE `users`.`id` = 6 LIMIT 1
  ↳ app/helpers/sessions_helper.rb:53:in `current_user'
  Like Load (0.3ms)  SELECT `likes`.* FROM `likes` WHERE `likes`.`user_id` = 6 AND `likes`.`drink_id` = 19 LIMIT 1
  ↳ app/controllers/likes_controller.rb:14:in `unlike'
  Rendering likes/unlike.js.erb
  CACHE Like Load (0.0ms)  SELECT `likes`.* FROM `likes` WHERE `likes`.`user_id` = 6 AND `likes`.`drink_id` = 19 LIMIT 1
  ↳ app/views/likes/_like.html.erb:2
   (0.3ms)  SELECT COUNT(*) FROM `likes` WHERE `likes`.`drink_id` = 19
  ↳ app/views/likes/_like.html.erb:4
  Rendered likes/_like.html.erb (Duration: 3.2ms | Allocations: 1654)
  Rendered likes/unlike.js.erb (Duration: 3.5ms | Allocations: 1762)
Completed 200 OK in 11ms (Views: 4.1ms | ActiveRecord: 1.5ms | Allocations: 4365)

しっかり、いいねを取り消すunlikeメソッドが反応してます

コンソール上ではエラーは確認されてません

きっとレンダリングが上手く行ってない可能性が高いと思います

該当のソースコード

drinks/index.erb

      <% @drinks.each do |drink|%>
      <li class='list'>
        <%= link_to drink_path(drink.id) do %>
          <%= link_to user_path(drink.user.id) do%>
            <div class="user-info-timeline">
                <%=image_tag drink.user.image.variant(resize: '60x60'),class: "user-img-timeline"  if drink.user.image.attached?%> 
                <div class="username-timeline">
                  <%= drink.user.nickname %>
                </div>
            </div>
          <% end %>
        <div class='item-img-content'>
          <%= image_tag drink.image , class: "item-img" if drink.image.attached? %>
          
          <%# if drink.trade%>
          
   
          
          <%# end %>
        </div>
        <div class='item-info'>
          <h3 class='item-name'>
            <%= drink.name %>
          </h3>
          <div class='item-price'>
            <span><%= drink.price %>円<br>(税込み)</span>
            <div class='star-btn'>
              <%# image_tag "star.png", class:"star-icon" %>
              <span class='star-count'>0</span>
            </div>
          </div>
          <div class='item-explain'>
            <%= drink.explain%>
          </div>
          <div class='item-tag'>
            <% drink.tags.each do |tag| %>
              #<%=tag.tag_name%>
            <%end%>
          </div>
          <%= render partial: "likes/like",locals:{drink: drink}%>
        </div>
       
        <% end %>

likes/_like.html.erb

<div class="like" id="like-link-<%= drink.id %>">
    <% if current_user.likes.find_by(drink_id: drink.id) %>
    <%= link_to unlike_path(drink.id), method: :delete, remote: true do %>
        <div class = "iine__button">❤️<%= drink.likes.count %></div>
    <% end %>
  <% else %>
    <%= link_to like_path(drink.id), method: :post, remote: true do %>
        <div class = "iine__button">♡️<%= drink.likes.count %></div>
    <% end %>
  <% end %>
</div>

likes/like.js.erb

$("<%= @id_name %>").html('<%= escape_javascript(render("likes/like", drink: @drink  )) %>');

likes/unlike.js.erb

$("<%= @id_name %>").html('<%= escape_javascript(render("likes/like", drink: @drink  )) %>');

こっちが上手くいかない。

like_controller

class LikesController < ApplicationController
  include SessionsHelper

  before_action :set_variables
  def like
   
    like = current_user.likes.new(drink_id: @drink.id)
    #redirect_to drinks_path
    # jsを用いるので画面遷移は行わない
    binding.pry
    like.save
  end

  def unlike
    like = current_user.likes.find_by(drink_id: @drink.id)
    binding.pry
    like.destroy
  end

  private

    def set_variables
      @drink = Drink.find(params[:drink_id])
      @id_name = "#like-link-#{@drink.id}"
    end

end

routes.rb

Rails.application.routes.draw do
  root to: 'drinks#index'
  get    '/login',   to: 'sessions#new'
  post   '/login',   to: 'sessions#create'
  delete '/logout',  to: 'sessions#destroy'
  get 'user/likes',  to: 'users#likes'
  resources :users do
    member do
      get :following,:followers
      # memberメソッドを使うと
      # ユーザーidが含まれてるURlを扱うようになる
    end
  end
  get '/drinks/searchdrink',  to: 'drinks#search_drink'
  resources :drinks, only: [:index,:new,:show,:create,:destroy] do
    collection do
      get 'search'
    end

    resources :comments,only: :create
    # あるツイートに対してのコメントと言う
    # 親子関係を表現したパスが、コメント投稿に必要なリクエストの
    # パスになります
    
    resources :trades,only: [:index,:new,:create]
  end
  post '/drinks/:id/trades/new', to: 'trades#create'
  resources :relationships, only: [:create,:destroy]
  post 'like/:drink_id' ,to: 'likes#like', as: 'like'
  delete 'like/:drink_id',to: 'likes#unlike', as: 'unlike'
end

試したこと

とあったので、drinkの部分を@drinkに全部

$(<%= @id_name %>).html('<%= escape_javascript(render("likes/like" ,locals: {drink: @drink})) %>');

に元々

$("<%= @id_name %>").html('<%= escape_javascript(render("likes/like" ,locals: {drink: @drink})) %>');

このように
ダブルクォーテーションを入れてたのですが、
likes_contorollerで
@id_name = "#like-link-#{@drink.id}"
と定義してたので、ダブルクォーテーションを外しても結果は変わりませんでした

また、binding.pry（デバッガーツール）で
likes_contorollerのiike,unlikeアクションはしっかり反応して、処理を止めてくれて、変数の中身にしっかり値が入ってくれました。

　御回答いただければ幸いです。

Answer 1

https://qiita.com/divclass123/items/de4ba62c02256e9dd8d4

これが答え