[RUBY] Implémentation de la fonction de commentaire (Ajax)

Je vais le préparer moi-même.

la mise en oeuvre

** Modèle de contrôleur créé **

routes.erb

  resources :posts do
    resources :comments, only: [:create, :destroy]
  end

Étant donné que les commentaires sont publiés, répertoriés, supprimés, etc. sur la page d'affichage des articles, seuls les éléments créer et détruire sont créés.

comments_controller.rb

class CommentsController < ApplicationController

  def create
    @post = Post.find(params[:post_id])
    @comment = @post.comments.new(comment_params)
    @comment.user_id = current_user.id
    @comments = @post.comments.all
    @comment.save
    render :create
  end

  def destroy
    @comment = Comment.find_by(id: params[:id], post_id: params[:post_id]).destroy
    @comment.destroy
    render :destroy
  end

  private
    def comment_params
      params.require(:comment).permit(:comment, :post_id)
    end
end

Changez la partie description de la transition avec redirect_to etc. Dans le cas ci-dessus ** Lors de la création d'une action, create.js.erb Pendant l'action de destruction, destroy.js.erb ** Il est censé voler.

js.erb est un fichier à créer ultérieurement.

posts_controller.rb

class PostsController < ApplicationController
  def show
    @post = Post.find(params[:id])
    @comment = Comment.new
    @comments = @post.comments.all
  end
end

Cette fois, nous pourrons publier des commentaires sur les articles / émissions

ruby:posts/show.html.slim

#Affichage de la liste des commentaires
.row
  .col-lg-4
    .col-lg-4

      # create.js.Nécessaire pour réécrire avec erb
      div id="comment-text"

        #Ignorer partiellement la liste des commentaires
        = render 'comments/comment', comments: @comments

    
#Formulaire de commentaire
  .row
    .col-lg-3
    .col-lg-6.text-center
      .frame-post-show

        #local pour appeler le fichier js:Supprimer la description de true
        = form_with(model: [@post, @comment]) do |f|

          = f.label :comment, class: "font-weight-bold col-lg-3 text-center"
          <br>
          = f.text_area :comment, :size=>"57x5"
          <br>

          .text-center= f.submit "Commenter", class: "btn btn-outline-secondary btn-sm"

Créez manuellement le fichier _comment.html.slim sous le répertoire des commentaires Collez la partie de la liste de commentaires qui a été ignorée dans le partiel.

ruby:comments/_comment.html.slim

- @comments.each do |comment|

  # destroy.js.Nécessaire pour réécrire avec erb
  div id="comment-#{comment.id}"
    .frame-post-comment
      = attachment_image_tag comment.user, :image, fallback: 'noimage.png', size: "50x40", class: "mb-3"
      = link_to comment.user.name, user_path(comment.user)
      - if comment.user == current_user
      
        #remote pour appeler le fichier js:Ajouter vrai
        = link_to 'Effacer', post_comment_path(comment.post, comment), method: :delete, remote: true, data: { confirm: "Effacerしてよろしいですか？" }, class: "btn btn-outline-danger btn-sm m-0 ml-3"
      <br>
      small.m-0= comment.created_at.to_s(:datetime_jp)
      .mt-4.mb-2= comment.comment

Créez manuellement le fichier create.js.erb sous le répertoire des commentaires

ruby:comments/create.js.erb

#　id="comment-text"Partie_comment.html.Réécrire du contenu mince sans transition de page
$('#comment-text').html("<%= j(render 'comments/comment',{ comments: @comments }) %>");

# f.text_Zone vide (si vous ne l'écrivez pas, le commentaire restera sur le formulaire après la publication)
$('textarea').val('');

Créez manuellement le fichier destroy.js.erb sous le répertoire des commentaires

ruby:comments/destroy.js.erb

# "comment-#{comment.id}"Masquer les messages avec
$('#comment-<%= @comment.id %>').remove();

**Achevée! ** **