前提・実現したいこと
いつもお世話になっております。
今ブログのように記事を投稿できるポートフォリオサイトを作成中で、タグ付け機能をacts-as-taggable-onというgemを使って実装しました。
各記事に紐つけたタグをトップページで一覧表示し、そのタグをクリックすると紐ついた記事が表示されるようにしたいです。
発生している問題
記事を投稿するときにタグを紐付けることと、記事の詳細ページからその記事のタグをクリックして絞り込み表示まではできています。
しかしトップページに登録済みのタグを一覧表示にすると、タグをクリックしてもうまく絞り込みができずに全ての記事が表示されてしまいます。
該当のソースコード
models/post.rb
class Post < ApplicationRecord acts_as_taggable has_rich_text :content has_one_attached :image belongs_to :user has_many :comments has_many :likes, dependent: :destroy has_many :like_users, through: :likes, source: :user ###以下略### end
posts_controller.rb
class PostsController < ApplicationController before_action :set_post, only: [:show, :edit,:destroy, :update] before_action :move_to_index, except: [:index, :show, :search] def index @posts = Post.includes(:user).order("created_at DESC").page(params[:page]).per(10) @post = Post.includes(:user) if params[:tag_name] @posts = Post.tagged_with("#{params[:tag_name]}").page(params[:page]).per(10) end @tags = Post.tag_counts_on(:tags).order('count DESC') end def show @comment = Comment.new @comments = @post.comments.includes(:user).order("created_at DESC") end def new @post = Post.new end def edit end def create @post = Post.new(post_params) if @post.valid? @post.save redirect_to root_path else render :new end end def update if user_signed_in? && @post.user == current_user @post.update(post_params) redirect_to post_path else render :edit end end def destroy if user_signed_in? && @post.user == current_user post.destroy redirect_to root_path else render :show end end def search @posts = Post.searchtext(params[:keyword]) end private def set_post @post = Post.find(params[:id]) end def post_params params.require(:post).permit(:title, :content, :image, :tag_list).merge(user_id: current_user.id) end def move_to_index unless user_signed_in? redirect_to action: :index end end end
views/posts/_form.html.erb
<%= form_with model: @post, local: true do |form| %> <%= render 'layouts/error_messages', model: form.object %> <div class="form-group"> <div class="field pt-5 mb-5"> <div class="d-flex justify-content-between align-items-center mb-2", id="image-list"></div> <%= form.label :アイキャッチ画像%> <%= form.file_field :image, id:"item-image", accept: "image/png, image/jpeg, image/gif" , class:"form-control"%> </div> <div id="image-list"></div> <div class="field mb-5"> <%= form.label :タイトル , class: "h5"%> <%= form.text_field :title, class:"form-control", placeholder:"タイトル(必須 40文字まで)", maxlength:"40" %> </div> <div class="field mb-5"> <%= form.label :記事, class: "h5"%> <%= form.rich_text_area :content %> </div> <div class="field mb-5"> <%= form.label :タグ, class: "h5" %> <%= form.text_field :tag_list, value: @post.tag_list.join(','), placeholder:"複数のタグを指定する時はカンマ(,)で区切ってください", class: "form-control" %> </div> <div class="actions"> <%= form.submit "投稿する", class:"form-control btn btn-outline-secondary "%> </div> </div> <% end %>
views/posts/index.html.erb
<div class="bg-sample"></div> <h3 class="text-lg-center mt-5">地球と人のつながりをもっと身近なものに。</h3> <p class="text-lg-center text-muted">みんなの投稿で普段の生活をもっと未来につなげよう</p> <br> <br> <hr> <% breadcrumb :root %> <div class="container"> <div class="row"> <div class="col-md-8"> <% @posts.each do |post| %> <div class="card mb-4"> <%= image_tag post.image.variant(resize:'300x400').processed, class: "card-img-top "%> <div class="card-body"> <h2 class="card-title"><%= post.title %></h2> <p class="card-text"><%= strip_tags(post.content.to_s).gsub(/[\n]/,"").strip.truncate(20)%></p> <div class="m-2"> <%= render partial: 'posts/posts', locals: { post: post }%> </div> <div class="col"> <a href="/users/<%= post.user.id %>", class="d-flex justify-content-start align-items-center", style="text-decoration: none"> <% if post.user.image.attached? %> <%= image_tag post.user.image, class:"avatar m-1"%> <% else %> <%= image_tag ("defo.jpg"), class:"avatar m-1"%> <% end %> <div class="flex-column"> <p class="h4 text-bold text-muted "><%= post.user.nickname %></p> <span class="text-muted small">投稿日時:<%= post.created_at.to_s(:datetime_jp) %></span> </div> </a> </div> </div> <div class="card-footer text-muted">投稿日時:<%= post.created_at.to_s(:datetime_jp) %> <div class="field"> <%= link_to '詳細ページ', post, class: "btn btn-outline-secondary form-control " %> </div> </div> </div> <% end %> </div> <div class="col-md-4"> <div class="card"> <div class="card-body"> <h5 class="card-title">タグ一覧</h5> <h6 class="card-subtitle mb-2 text-muted">クリックで関連した記事が見れます</h6> <% @tags.each do |tag| %> <span class="badge badge-pill badge-info m-1 p-2"> <%= link_to tag.name, posts_path(tag_name: tag.name)%> </span> <% end %> <a href="#" class="card-link">Card link</a> <a href="#" class="card-link">Another link</a> </div> </div> </div> </div> <%= paginate @posts %> <div class="container" style="margin-bottom:100px;">
views/posts/_tag_list.html.erb
<% tag_list.each do |tag| %> <span class="badge badge-pill badge-info mr-1 p-2"> <%= link_to tag, posts_path(tag_name: tag), class: "text-white" %> </span> <% end %>
試したこと
トップページのタグ一覧をクリックしてリンク先に飛ぶときのURLは
「http://localhost:3000/posts?tag_name=4」
でタグが数字で表示されているのですが、絞り込みが正常にできているタグのリンク先のURLは「http://localhost:3000/posts?tag_name=猫」となっておりデータ・ベースに保存されているデータの呼び出し方が違うというのは分かりました。そこでposts_controller.rbのindexを
@tags = Post.tag_counts_on(:tags).order('count DESC')
の部分を
@tags = Post.tag_list_on(:tags).order('count DESC')
に変更して試してみたのですがundefined method `tag_list_on' for #Class:0x00007fe8f28dc3a8というエラーが出ました。
後は同じ箇所のインスタンス変数を変えてみたりしたのですが
変更前
<% @tags.each do |tag| %> <span class="badge badge-pill badge-info m-1 p-2"> <%= link_to tag.name, posts_path(tag: tag.name)%> </span> <% end %>
変更後
<% @posts.each do |post| %> <span class="badge badge-pill badge-info m-1 p-2"> <%= link_to tag, posts_path(tag: tag.name)%> </span> <% end %>
undefined method `name' for #Post:0x00007fe90237fb98というエラーが出ます。
公式リファレンス:acts-as-taggable-onにも目を通してみたのですが、自分自身が初心者なのもあり解決に繋がるような情報は得られませんでした。
他にも調べてみたのですが中々自分では解決方法が思いつかなかったので質問させていただきました。
適切な方法を教えていただけると幸いです。
よろしくお願いします。
補足情報(FW/ツールのバージョンなど)
ruby_version 2.6.5
Rails 6.0.3.4
今回の実装はこの記事を参考に致しました。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/11/04 00:12