【rails】viewにてフォローの分岐を作る

※本サイトで紹介している商品・サービス等の外部リンクには、アフィリエイト広告が含まれる場合があります。

実際にフォローするためのviewを作る

フォロー機能は実装できたので、いざフォローするためのボタン等を作る

今回はuserのアカウントページでfollowボタンを表示させる


アカウントページを作る

アカウントページのurlを作る

routes.rbを開く

  resources :accounts, only: [:show]

showアクションを定義する

↓ http://localhost:3000/rails/info/routesを確認

AccountsControllerを新たに作成する

class AccountsController < ApplicationController
  def show
    @user = User.find(params[:id])
  end
end

viewを作る

viewsにaccountsのフォルダ、show.html.hamlのファイルを作る

articlesのshow.html.hamlを開き、アカウントページへのリンクを貼る

  .article_detail
    = image_tag @article.user.avatar_image

# ↓link_toして、入れ子構造にする
  .article_detail
    = link_to account_path(@article.user) do
      = image_tag @article.user.avatar_image

自身のページでは表示を切り替える

accountページでは、表示を以下のように切り替える

  • current_userなら「Edit」を表示
  • その他のuserなら「Follow」を表示
        .profilePage_user_actionButton
          - if user == current_user
            = link_to 'Edit', edit_profile_path
          - else
            = link_to 'Follow', '#'

パスは次回!


フォロー済みなら非表示にする

user.rbに以下を定義する

  # current_user.has_followed?(User.second) の意味

  def has_followed?(user)
    following_relationships.exists?(following_id: user.id)
  end

_profile.html.hamlに以下を追記する

- if current_user.has_followed?(user)
  %P フォロー済み

フォロー分岐について

viewでの分岐のまとめ

  1. userがcurrent_user(自身)なら「Edit」と表示する
  2. 違う場合、following_relationshipsの中からフォロー済みのuserか探してくる
  3. 一致したら「フォロー済み」と表示する
  4. 違う場合、「Follow」と表示させる

ログインしていないとエラーが起きる

事象1

ログインせずにurlだけ貼り付けてアカウントページを読み込む

すると、「undefined method `has_followed?’ for nil:NilClass」のエラーが起きる

current_userじゃないので、フォロー済みか探すことができないことが原因

「&」をつけて続きを実行しないようにする

  - if user == current_user
    = link_to 'Edit', edit_profile_path
  - else
    - if current_user&.has_followed?(user) # &(ぼっち演算子をつける)
      %P フォロー済み
    - else
      = link_to 'Follow', account_follows_path(user), data: { method: 'post'}

事象2

事象1を解決したので、ページ再読み込み後に「Follow」を押してみる

すると、「undefined method `follow!’ for nil:NilClass」のエラーが起きる

current_userじゃないのでフォローが実行できないことが原因

follows_controllerにて、ログイン必須と追記する

class FollowsController < ApplicationController
  before_action :authenticate_user!

ログインせずにフォローしようとすると、ログイン画面が表示されるようになる

#DAY3