Rails 7(Turbo 和 Hotwire):类似于 Reddit 的嵌套评论
作者:互联网
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,数据库,编写, 来源: