formオブジェクト(ActiveModel)を用いたタグ機能(タグ検索)

説明

自分はformオブジェクトを用いてタグ機能は実装したのですが、投稿はともかく編集、削除、検索などは記事が少なく、あっても複雑で苦労したのでいくつかに分けて投稿したいと思います。今回はタグをクリックするとそのタグのついた投稿の一覧に飛ぶ機能を解説します。

前提条件

この記事は複数投稿編、編集、削除編を閲覧していただいている前提の解説となります。

完成コード

routes.rb

resources :tweets do
    collection do
      get 'search'
      get 'search_tag'
      get 'search_incre_tag'
      get 'search_tags'
      get 'search_status'
      get 'search_job'
    end
    resources :comments, only: [:create]
    resources :likes, only: [:create, :destroy] 
  end

_tweet.html.erb(タグのビュー)

<div class="search-subTtl">タグ検索</div>
        <div class="search-tagContainer">
          <%= link_to search_tags_tweets_path, class: "search-form tag-searchBtn" do %>
            <i class="fas fa-tags"></i>タグで検索する
          <% end %>
        </div>

tweets_controller.rb

def search_tag
    relations = TweetTagRelation.where(tag_id: params[:tag])
    @tag_tweets = []
    relations.each do |relation|
      @tag_tweets << Tweet.find_by(id: relation.tweet_id)
    end
  end

search_tag.html.erb(タグ関連の投稿一覧のビュー)

<% if @tag_tweets != [] %>
            <% @tag_tweets.each do |tweet| %>
              <li class='tweet-list'>
                <%= link_to tweet_path(tweet.id), remote: true, class: "show-link" do %>

                  <%= render partial: "shared/tweet",  locals: { tweet: tweet } %>

                <% end %>
              </li>
            <% end %>
          <% end %>

コード解説

routes.rb

resources :tweets do
    collection do
      get 'search'
      get 'search_tag'
      get 'search_incre_tag'
      get 'search_tags'
      get 'search_status'
      get 'search_job'
    end
    resources :comments, only: [:create]
    resources :likes, only: [:create, :destroy] 
  end

_tweet.html.erb(タグのビュー)

<% if tweet.tags != [] %>
    <div class="tweet-tags">
      <ul class="tweet-tagList">
        <% tweet.tags.each do |tag| %>
          <%= link_to search_tag_tweets_path(tag: tag), method: :get, class: "tag-link" do %>
            <div class="tag-name">#<%= tag.name %></div>
          <% end %>
        <% end %>
      </ul>
    </div>
  <% end %>

まずget 'search_tag'をルーティングに記述します。この時idが必要なのでcollectionで囲みます。そしてビューには繰り返し文でタグを表示し、リンクに先ほど作ったルーティングのsearch_tag_tweets_path(tag: tag)を記入し、引数には投稿に関連したtagの情報を入れるため(tag: tag)を記入します。

tweets_controller.rb

def search_tag
    relations = TweetTagRelation.where(tag_id: params[:tag])
    @tag_tweets = []
    relations.each do |relation|
      @tag_tweets << Tweet.find_by(id: relation.tweet_id)
    end
  end

コントローラーではまず引数でもらったタグの情報を元にrelations = TweetTagRelation.where(tag_id: params[:tag])を記述してrelationsに中間テーブルの情報を入れます。そして@tag_tweetsという空の配列を作り、そこに中間テーブルに関連した投稿を配列として入れていきます。

search_tag.html.erb(タグ関連の投稿一覧のビュー)

<% if @tag_tweets != [] %>
            <% @tag_tweets.each do |tweet| %>
              <li class='tweet-list'>
                <%= link_to tweet_path(tweet.id), remote: true, class: "show-link" do %>

                  <%= render partial: "shared/tweet",  locals: { tweet: tweet } %>

                <% end %>
              </li>
            <% end %>
          <% end %>

タグに関連した投稿一覧のビューを作ります。そこでコントローラーで作った@tag_tweetの中身の投稿を繰り返し文で取り出していき、完成です。

まとめ

以上がfromオブジェクトでのタグに関連した投稿一覧の解説となります。閲覧ありがとうございました。