実現したいこと
ツイッター、インスタのようなフォロー機能を非同期で実装したい。
現状の問題
エラーなどは出ていないです。
フォロー、フォロー解除するボタンの切替を非同期で行うことができる。
が、フォロー・フォロワーを数える部分がクリックするごとに反映されない。
(ページを再読み込みするとフォロー部分の人数が表示される。)
※ちゃんとクリックするごとにデータベースには保存されています。
まだまだrailsの初心者です。
エラーなどはでてないので、js.erbに関するやりとりの部分がうまくできてないのかなと
自身では思っています。
色々試行錯誤してトライしてみてもクリックの度に数が変化しません。。
ご教授お願いいたします。
お願いいたします。
該当のソースコード
user.rb
has_many :following_relationships, foreign_key: "follower_id", class_name: "Relationship", dependent: :destroy has_many :following, through: :following_relationships has_many :follower_relationships, foreign_key: "following_id", class_name: "Relationship", dependent: :destroy has_many :followers, through: :follower_relationships #フォローしているかを確認するメソッド def following?(user) following_relationships.find_by(following_id: user.id) end #フォローするときのメソッド def follow(user) following_relationships.create!(following_id: user.id) end #フォローを外すときのメソッド def unfollow(user) following_relationships.find_by(following_id: user.id).destroy end
relationship.rb
class Relationship < ApplicationRecord belongs_to :follower, class_name: "User" #自分がフォローしているユーザー belongs_to :following, class_name: "User" #バリデーション validates :follower_id, presence: true validates :following_id, presence: true end
users_controller.rb
def show @user = User.find(params[:id]) @writes = @user.writes end def following #@userがフォローしているユーザー @user = User.find(params[:id]) @users = @user.following render 'show_follow' end def followers #@userをフォローしているユーザー @user = User.find(params[:id]) @users = @user.followers render 'show_follower' end
users/show.html.erb(フォロー・フォロワー人数表示)
<div class="follower"> <%= link_to followers_user_path(@user.id) do %> <h5 style="color: black">フォロワー <%= @user.followers.count %>人</h5> <% end %> </div> <div class="follow"> <%= link_to following_user_path(@user.id) do %> <h5 style="color: black">フォロー <%= @user.following.count %>人</h5> <% end %> </div> <div> <%= render "follow_form" %> </div>
users/_follow_form.html.erb(フォローボタン分岐)
<% if user_signed_in? && @user != current_user %> <div id="follow_form"> <% if current_user.following?(@user) %> <%= render "unfollow" %> <% else %> <%= render "follow" %> <% end %> </div> <% end %>
users/_follow.html.erb(フォローボタン表示)
<!-- フォローボタン ------------------------------------------------------------------> <%= form_for(current_user, url: relationships_path, method: :post, remote: true) do |f| %> <%= hidden_field_tag :following_id, @user.id %> <%= f.submit "フォローする" %> <% end %>
users/_unfollow.html.erb(フォロー解除ボタン表示)
<%= form_for(current_user, url: relationship_path(@user), method: :delete, remote: true) do |f| %> <%= f.submit "フォロー解除" %> <% end %>
views/relationships/create.js.erb
$("#follow_form").html("<%= j(render("users/unfollow")) %>");
views/relationships/destroy.js.erb
$("#follow_form").html("<%= j(render("users/follow")) %>");
appilication.js
//= require activestorage //= require jquery //= require jquery_ujs //= require turbolinks //= require_tree .
gemfile
gem 'pry-rails' gem 'compass-rails', '3.1.0' gem 'sprockets', '3.7.2' gem 'devise' gem 'jquery-rails'
あなたの回答
tips
プレビュー