建立一个嵌套的评论

  1. 建立数据库结构和嵌套视图(使用Stimulus取元素和绑event)
  2. 可以删除评论,可以对嵌套视图的层数进行控制.
  3. 用Ajax代替完全的刷新页面。
  4. 删除一个评论,但不丢失它的子评论。。。。
  5. 给嵌套评论添加pagination。

视频1

https://gorails.com/episodes/nested-comment-threads-in-rails-part-1?autoplay=1

目标:建立数据库结构,和嵌套视图。

方法概览:

1. 建立一个可以自我关联的comment的表结构。

2. 建立partial模版_comment和_form

3. 设置routes, 出现post/1/comments/2这样的url

4. 新建controller:

 class Posts::CommentsController < CommentsController
//内部添加before_action :set_commentable, 通过params[:post_id]找到对应的@post实例。

5. 新建CommentsController类,增加create方法

6. 在show页面添加form渲染和comment渲染

7. 基本结构已经做出来了,下面进行嵌套评论的设计,代码在视图层完成。

在comment模版上增加form模版:

  • 在_form上添加parent_id的输入框<input>,parent_id自动得到值,因此设置为不可见type='hidden'
  • 子评论form默认不可见,需要点击‘回复reply’才出现。comment模版增加这个功能。这里使用Stimulus来取元素(reply 链接)并绑定click事件(添加/移除 form模版)

8. 需要在父评论的下面显示新增子评论。而不是直接显示在所有评论最下方。因此需要修改show视图。

  • show视图只显示非子评论。即渲染comment时,增加一个筛选parent_id: nil。
  • 在comment模版中,渲染出当前评论的子评论<%= render comment.comments %>
  • 还是comment模版,它渲染的form模版,传入的变量改为comment.commentable。
rails new -m template.rb nested_coments

cd nested_comments

rails g scaffold Post title body:text

rails g model Comments user:references commentable:references{polymorphic}:index parent_id:integer body:text

rails db:migrate
解释:
commentable:references{polymorphic}:index 用于一个model belongs_to从属多个models.即Polymorphic.
生成了commentable_type:string, commentable_id:integer,以及这两个列组成的index.
class Post < ApplicationRecord
has_many :comments, as: :commentable
end class Comment < ApplicationRecord
belongs_to :user
belongs_to :commentable, polymorphic: true
belongs_to :parent, optional: true, class_name: "Comment"
//optional和class_name用于内部Comment关联,并且这是可选的无需存在验证。✅ def comments
//搜索某个post下的一个父评论的所有它的子评论。
//搜索条件1: comment记录的commentable_type和commentable_id指向post,
//因为添加了commentable的index索引,所以使用commentabel: commentable
//搜索条件2: comment记录的子评论,用parent_id即可得到。
 Comment.where(commentable: commentable, parent_id: id)
 end
end

解释Polymorphic 关联:

一个model可以属于belongs_to多个其他model。

commentable_id, commentable_type已经由model产生。

@comment.commentable_id是@post的

Nested Comment Treads in ROR的更多相关文章

  1. 前端备忘录 — IE 的条件注释

    CSS hack 由于不同厂商的浏览器,比如 Internet Explorer,Safari,Mozilla Firefox, Chrome 等,或者是同一厂商的浏览器的不同版本,如 IE6 和 I ...

  2. javascript 之正则匹配HTML

    正则表达式 <(\S*?) [^>]*>.*?</\1>|<.*? /> 匹配 <html>hello</html>|<a> ...

  3. ccs6.0使用问题记录

    ccs6.0使用问题记录 彭会锋 1 编译过程中提示warning  " Description Resource Path Location Type #9-D nested commen ...

  4. 关于IE条件注释(译)

    本文翻译自此篇文章.翻译纯属业余. 许多网站为了确保他们的站点能够在不同的浏览器上有不同的显示效果而使用特征检测,一些传统的网站使用其他技术,诸如在服务器或客户端上使用脚本去检测浏览器类型.在这里我们 ...

  5. 统计C/C++代码行数

    近日在写一个统计项目中C/C++文件(后缀名:C/CPP/CC/H/HPP文件)代码行数的小程序.给定包含C/C++代码的目录,统计目录里所有C/C++文件的总代码行数.有效代码行数.注释行数.空白行 ...

  6. 算法语言Scheme修订6报告 R6RS简体中文翻译

    算法语言Scheme修订6报告 R6RS简体中文翻译 来源 https://r6rs.mrliu.org/   MICHAEL SPERBERR. KENT DYBVIG, MATTHEW FLATT ...

  7. CocoSourcesCS 2

    CocoSourcesCS 2 /*------------------------------------------------------------------------- DFA.cs - ...

  8. Css:Conditional comments 条件注释

    http://msdn.microsoft.com/en-us/library/ms537512(VS.85).aspx http://www.quirksmode.org/css/condcom.h ...

  9. 【转帖】从 Oracle 到 PostgreSQL ,某保险公司迁移实践 技术实践

    从 Oracle 到 PostgreSQL ,某保险公司迁移实践 http://www.itpub.net/2019/11/08/4108/ 信泰人寿保险股份有限公司 摘要:去O一直是金融保险行业永恒 ...

随机推荐

  1. aop的使用

    最近考虑需要记录客户对项目的操作日志. 如果在每一个客户都有可能操作的类增加日志对象,改动量太大,同时如果有新的功能增加,又要在新的功能上增加日志操作. 因此考虑后决定采用spring的aop功能. ...

  2. CSS的再一次深入(更新中···)

    全面我们学了6个选择器,今天再来学习两个选择器,分别是通配符选择器和并集选择器: 1.通配符选择器: *{ } 表示body里所有的标签都被选中 2.并集选择器: 选中的标签之间用逗号隔开,表示这几个 ...

  3. Python3基础 list + *运算 扩充列表

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  4. 再谈 apache设置virtualhost + apache的一些相关设值

    首先 要弄懂究竟什么是, vitrual host: 虚拟主机, 他有什么用处? 就是说: 一台计算机(server)中, 通常只是放一个网站/站点 但是 如果机器紧张, 服务器性能比较好,或访问的站 ...

  5. ZOJ 3962 Seven Segment Display(数位DP)题解

    题意:给一个16进制8位数,给定每个数字的贡献,问你贡献和. 思路:数位DP,想了很久用什么表示状态,看题解说用和就行,其他的都算是比较正常的数位DP. 代码: #include<iostrea ...

  6. 【做题】51NOD1518 稳定多米诺覆盖——容斥&dp

    题意:求有多少种方案,用多米诺骨牌覆盖一个\(n\times m\)的棋盘,满足任意一对相邻行和列都至少有一个骨牌横跨.对\(10^9+7\)取模. \(n,m \leq 16\) 首先,这个问题的约 ...

  7. (转)Spring & SpringMVC学习

    https://shimo.im/docs/CzXTpHe7DlYbknEn/   掌握过程:   业务逻辑(漏洞.合理性处理).设计-->技术流程.原理.搭建.整体架设-->源码分析.断 ...

  8. Directional RNA-seq data -which parameters to choose?

    Directional RNA-seq data -which parameters to choose? REF: https://chipster.csc.fi/manual/library-ty ...

  9. [POJ 3984] 迷宫问题(BFS最短路径的记录和打印问题)

    题目链接:http://poj.org/problem?id=3984 宽度优先搜索最短路径的记录和打印问题 #include<iostream> #include<queue> ...

  10. 今天就整一个bug了

    BeanPostProcessor加载次序及其对Bean造成的影响分析 SSM整合出现not found for dependency: expected at least 1 bean which ...