Rails 7（Turbo 和 Hotwire）：类似于 Reddit 的嵌套评论

2022-12-25 18:03:13 阅读：452 来源： 互联网

Rails 的最新主要版本为其开发人员带来了他们一直希望的东西：在编程方面尽可能地远离 JavaScript。

撇开玩笑不谈，自从 Rails 7 发布以来，我一直很着迷，我希望我也能在这篇文章中传达这种印象，我将在这篇文章中重新追溯我开发博客应用程序的步骤 - drumrolls！
我知道，我知道，对于编写博客的 Ruby on Rails 开发人员来说，这是一个巨大的惊喜，但请坦白，因为在这个应用程序中，我将以嵌套评论的形式应用新鲜出炉的 Rails 魔法，所有的操作都是热连线和涡轮增压！

（注意：我不会深入了解 Turbo Frames 或 Turbo Streams 是什么，因为那里有很多解释得很好的文章都专注于此，在这里用我自己的话重写会增加太多开销这篇文章）

（TLDR；赶时间的人的GitHub 存储库）

一开始，有 Rails Generator！

事不宜迟，让我们直接创建一个新的 Rails 7 应用程序（您可以rails -v事先在终端中运行来检查您机器的 Rails 版本，只是为了确保您安装了正确的版本——或者根本没有安装任何版本）：

轨道新嵌套评论

在这篇文章中，我将只关注评论，因此其他一切都将只是一些好的 ole'Rails。
因此，让我们继续，从nested_comments根目录开始，让我们打开一个新终端并生成一个Post带有标题和内容的简单脚手架：

rails 生成脚手架帖子标题：字符串内容：文本标题：字符串内容：文本

以及Comment一个引用Post它所属的模型、一个内容和一个引用，parent以防一条评论是对另一条评论的回复：

rails 生成模型 Comment post:references parent:references content:text帖子：引用父：引用内容：文本

现在，在我们走得太远并运行数据库迁移之前，我们需要更改评论的那个，因为parent除非我们指定我们正在引用哪个表，否则目前没有意义，而且我们需要从中删除null: false约束它也是，因为评论并不总是必须是对另一条评论的回复：

类 CreateComments < ActiveRecord::Migration [ 7.0 ] 
  def  change
     create_table :comments  do | 吨| 
      t.references :post , null:  false , foreign_key: { on_delete:  :cascade } 
      t.references :parent , foreign_key: { to_table:  :comments , on_delete:  :cascade } 
      t.text :content

       t.timestamps 
    end 
  end 
end

comment.rb应更改模型以匹配更新的迁移：

class  Comment < ApplicationRecord
   belongs_to :post , inverse_of:  :comments
   belongs_to :parent ,可选:  true , class_name:  'Comment' , inverse_of:  :comments

   has_many :comments , foreign_key:  :parent_id , dependent:  :destroy , inverse_of:  :parent 
end

正如您可能已经belongs_to :post从上面的行中注意到的那样，我们还必须在post.rb模型中添加关系：

类 Post < ApplicationRecord
   has_many :comments , inverse_of:  :post 
end

最后，我们可以运行rails db:migrate以更新我们辛勤工作的数据库。

（有趣的事实：你知道即使命令本身也是一个生成器吗？你可以在技术上生成一个非常好的应用程序，但不要引用我的话）rails new

热门、有线和涡轮化

现在我们有了“MVC”中的“M”，让我们关注“C”——控制器。

在尝试查看模板和控制器之前，我喜欢做的是打开rails c控制台并创建一些虚拟对象：

post = Post.create(title: 'A Post', content: 'some post content')title:  'A Post' , content:  '一些帖子内容' ) 
parent = Comment.create( post: post, content:  'a comment' ) 
reply = Comment.create( post: post, parent: parent, content:  'a reply' ) 
Comment.create( post: post, parent: reply, content:  '另一个回复' ) 

Comment.create( post: post, content:  '另一个评论' )

然后让我们将即将到来的端点添加到routes.rb：

Rails.application.routes.draw do做
  资源：帖子
  资源：评论
结束

评论#index

在该目录下，让我们为帖子的评论app/controllers创建一个comments_controller.rb带有操作的新目录。index

类 CommentsController < ApplicationController
   before_action :set_post 

  def  index 
    @comments = @post .comments 
  end

   private 

  def  set_post 
    @post = Post.find_by( id: params[ :post_id ]) 
  end 
end

这对所有端点都有意义set_post，因为在我们处理评论的任何步骤中，它都来自帖子。

作为第一步，我们想要实现的是，在帖子下将所有评论都放在另一个下面（还没有嵌套……还！）。因此，让我们最终涡轮增压

标签：Rails,JavaScript,Comment,数据库,编写,
来源：

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

Rails 7（Turbo 和 Hotwire）：类似于 Reddit 的嵌套评论

一开始，有 Rails Generator！

热门、有线和涡轮化

评论#index