赵龙 全栈之路

加分题 第二课. 3-13 投票排序topics与新增“about”页面

| Comments

  • 根据投票分数排序 topics。
  • 新增一个 'about' 页面,并将连结放在 topics 列表的最下方。记得也要在 About 页面上放置回 Topics 列表的连结,以免使用者迷路。

这两个问题尝试自己解决,最后发现解决不了,google搜索了Logdown 加分题,找到了解决方法。
参考资料1
参考资料2
参考资料3

投票排序topics

app/controllers/topics_controller.rb中的index修改为如下

app/controllers/topics_controller.rb
  def index
    @topics = Topic.all
    @topics = @topics.sort_by{ |topic| topic.votes.count }.reverse
  end

sort_by是排序用的方法,依照topic.votes.count排序。默认是从大到小,-topic.votes.count加了一个-变成从小到大。
不能完全理解,先背下来。
效果如图:

新增“about”页面

解题思路

要实现一个动作,需要 controller 里面有 action,view 里面有 html 页面,routes 里面有路径才行。

步骤1:增加about动作

app/controllers/topics/index.html.erb中private上方添加以下代码。

app/controllers/topics_controller.rb
  def about
  end

注意:这一步可以省略,因为about页面并没有controler,所以不用。

步骤2:新增about页面文件

终端执行touch app/views/topics/about.html.erb指令,新增about.html.erb文件,让页面看起来这样:

app/views/topics/about.html.erb
<h1> About </h1>
<br>
<%= link_to 'Back', topics_path%>

步骤3:增加一个按钮用来跳转到 about 页面

修改app/views/topics/index.html.erb,在<%= link_to 'New Topic', new_topic_path %>增加如下代码:

app/views/topics/index.html.erb
<br>
<%= link_to 'About', about_path %>

<br>这个代码是用来断行的。

步骤4:在about 页面留下返回主页的路径

修改config/routes.rb文件,增加一行 get ‘about’ => 'topics#about'

config/routes.rb
Rails.application.routes.draw do
  root 'topics#index'
  get 'about' => 'topics#about'
  resources :topics do
    member do
      post 'upvote'
    end
    member do
      post 'reduce'
    end
  end
  get '/about/', to:'topics#about'
end

效果如图:


Comments

comments powered by Disqus