前提・実現したいこと
本のレビューアプリを作成しています。
コメントの非同期通信機能と検索欄のインクリメンタルサーチ機能の実装において、
初回のエラーを防止するためにturbolinksをGEMfileから削除したところ、
いいねの機能がリロードしないと反映されなくなったので原因と解消方法を知りたいです。
因みにいいね機能に関しては非同期通信はしてないです。
発生している問題・エラーメッセージ
html <div class = "heart"> <h3>❤️<%= @book.likes.count %></h3> </div> <% if current_user.already_liked?(@book) %> <%= button_to '????やめる', book_like_path(@book), method: :delete, remote: true %> <% else %> <%= button_to '❤️いいね', book_likes_path(@book), remote: true %> <% end %>
gemfile # Use CoffeeScript for .coffee assets and views gem 'coffee-rails', '~> 4.2' # Turbolinks makes navigating your web application faster. Read more: https://github.com/turbolinks/turbolinks # gem 'turbolinks', '~> 5' # Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder gem 'jbuilder', '~> 2.5' # Use Redis adapter to run Action Cable in production # gem 'redis', '~> 4.0' # Use ActiveModel has_secure_password # gem 'bcrypt', '~> 3.1.7' # Use ActiveStorage variant
applocation.html <!DOCTYPE html> <html> <head> <title>BookApp</title> <%= csrf_meta_tags %> <%= csp_meta_tag %> <%= stylesheet_link_tag 'application', media: 'all' %> <%= javascript_include_tag 'application' %> <link href="https://fonts.googleapis.com/css?family=Ravi+Prakash" rel="stylesheet"> </head> <body> <div class="header"> <% if user_signed_in? %> <span> <img src="<%= current_user.image %>" class = "header__img"> <h2><%= link_to current_user.name, "/users/#{current_user.id}" %></h2> </span> <h1><%= link_to "BOOKLovers", root_path %></h1> <ul class="user__info"> <li> <%= link_to "users", users_path %> <%= link_to "new_page", new_book_path %> <%= link_to "log_out", destroy_user_session_path, method: :delete, data: { confirm: 'ログアウトしますか?' } %> </li> </ul> <% else %> <h1 class = "header__logo"><%= link_to "BOOKLovers", root_path %></h1> <ul class="user__info"> <li> <%= link_to "users", users_path %> <%= link_to "sgin_up", new_user_registration_path %> <%= link_to "log_in", new_user_session_path %> </li> </ul> <% end %> </div> <%= yield %> </body> </html>
aplication.js // This is a manifest file that'll be compiled into application.js, which will include all the files // listed below. // // Any JavaScript/Coffee file within this directory, lib/assets/javascripts, or any plugin's // vendor/assets/javascripts directory can be referenced here using a relative path. // // It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the // compiled file. JavaScript code in this file should be added after the last require_* statement. // // Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details // about supported directives. // //= require jquery //= require rails-ujs //= require activestorage //= require_tree .
試したこと
追加したファイルに関する、turbolinksの記述は削除しました。
補足情報(FW/ツールのバージョンなど)
ここにより詳細な情報を記載してください。
turbolinksをGEMfileから削除
とあるのですが、その際、合わせて行ったことを質問文に記載した方がよさそうです。
turbolinksの使用をやめる際は、Gemfile から削除する以外にもいくつかやることがあったと思うので、それらがすべて行われているかどうかの手掛かりになると思います。
必要ファイル追記しました!よろしくです!
う~ん、問題なさそうに見えますね....
それ以外で気になっているのは、
①非同期通信はしていないはずなのに、remote: true がついていること(remote: true は本当はない?)
↓
<%= button_to '❤️いいね', book_likes_path(@book), remote: true %>
②サーバー側(rails sの画面)でエラーが出ていないかどうか
③後はブラウザのF12開発者ツールにエラーが出力されていないかどうか
④いいねボタン押下のアクションのviewファイル
の4つくらいでしょうか...確認してみてください
remote: true消したらいけました!!
remote: trueはいいねの非同期通信実装しようとしていた時に消し忘れていました!
ありがとうございます!!
回答1件
あなたの回答
tips
プレビュー