1、功能描述：
（1）一个用户对同一帖子只能点赞一次，点击第二次是取消赞
（2）用户不刷新页面的时候，点赞时当前页面相应贴子的点赞数+1，图标变成fa-thumbs-up，取消赞时当前页面相应帖子的点赞数-1，图标变成fa-thumbs-o-up，不受其他用户同时点赞操作的影响，这需要js来控制。
C、用户必须登录才能给帖子点赞。没有登录的话，点赞需要提醒登录。(在3.10章第3节已经实现了 if @current_user)
2、创建thumbs表来保存点赞信息，表结构如下:
3、执行命令创建thumbs表格
#产生映射文件 /vagrant/data_symtem$ rails g model thumb account_id:integer post_id:integer is_thumb:boolean #系统返回信息 create db/migrate/20181031104807_create_thumbs.rb create app/models/thumb.rb invoke test_unit create test/models/thumb_test.rb create test/fixtures/thumbs.yml #将映射文件映射到数据库 /vagrant/data_symtem$ rake db:migrate #系统返回信息 == 20181031104807 CreateThumbs: migrating ===================================== -- create_table(:thumbs) -> 0.0137s == 20181031104807 CreateThumbs: migrated (0.0153s) ============================
4、在routes.rb文件中添加路由，来指定点击点赞按钮，调用的action以及定义要传递给action的参数
get 'posts/create_thumb/:post_id/:is_thumb' => 'posts#create_thumb'
代码解析：
get 'posts/create_thumb/:post_id/:is_thumb' => 'posts#create_thumb'
后面跟的/:post_id/:is_thumb是通过链接跳转传递的参数，在routes中定义参数，在views中给参数赋值，最后可在controller中通过param[:post_id]取出参数
5、在posts_controller.rb文件中添加方法create_thumb
def create_thumb post_id = params[:post_id] is_thumb = params[:is_thumb] account_id = @current_user.id thumb = Thumb.find_or_create_by(account_id:account_id,post_id:post_id) if is_thumb == "0" thumb.is_thumb = false elsif is_thumb == "1" thumb.is_thumb = true end thumb.save end
代码解析
：
is_thumb = params[:is_thumb]
:is_thumb是通过/posts/create_thumb/:post_id/:is_thumb链接传递过来的参数，is_thumb为0代表取消点赞，为1代表点赞
thumb = Thumb.find_or_create_by(account_id:account_id,post_id:post_id)
假设account_id为1，post_id为3，此行代码的意思是查找Thumb表中是否有account_id为1，post_id为3对应的数据，有的话，直接查找出来，没有的话，就创建一个account_id为1，post_id为3的thumb数据。
6、编辑app/models/post.rb文件中get_thumbs、get_thumb_info方法，用来获取帖子的点赞数，以及判断当然用户是否给该帖子点过赞
#获取点赞数 def get_thumbs num = Thumb.where(post_id:self.id,is_thumb:true).count end #获取此用户是否给该帖子点过赞，默认为未点过 def get_thumb_info(account_id) thumb = Thumb.find_by(post_id:self.id,account_id:account_id) boolean = false if thumb && thumb.is_thumb boolean = true end end
代码解析：
num = Thumb.where(post_id:self.id,is_thumb:true).count
代码中的self代表当前调用该方法的实例对象，这里的self指的是Post对象
7、编辑views/home/index.html.erb文件，在最下面加上js方法
当点击点赞<a>标签，会调用js方法praiseReplay(oldTotal)，oldTotal代表点赞<a>标签。
如果oldTotal中的class元素为fa fa-thumbs-up(已点赞图标),说明当前用户已给该贴点过赞了,本次点击是需要将赞取消,将class元素换成fa fa-thumbs-o-up(未点赞图标)，将oldTotal里面的内容innerHTML(即当前点赞数)减1，将href元素中传递的is_thumb参数换成0，这样在页面点赞数减1之后，后台数据库中的数据会和页面同步。
<script type="text/javascript"> function praiseReplay(oldTotal){ if(oldTotal.className == "fa fa-thumbs-up") { oldTotal.className = "fa fa-thumbs-o-up"; var oldValue = oldTotal.innerHTML; oldTotal.innerHTML = " " + (parseInt(oldValue) - 1); href = oldTotal.href oldTotal.href = href.substring(0, href.length - 1) + "0" } else { oldTotal.className = "fa fa-thumbs-up"; var oldValue = oldTotal.innerHTML; oldTotal.innerHTML = " " + (parseInt(oldValue) + 1); href = oldTotal.href oldTotal.href = href.substring(0, href.length - 1) + "1" } } </script>
8、编辑views/home/index.html.erb文件，调用js方法
<!--原代码--> <a data-remote="true" href="#" id="reduce" class="fa fa-thumbs-up"> <!--改为--> <a data-remote="true" href="/posts/create_thumb/<%= p.id %>/0" id="reduce" class="fa fa-thumbs-up" onclick="praiseReplay(this)"> <!--原代码--> <a data-remote="true" href="#" id="increase" class="fa fa-thumbs-o-up"> <!--改为--> <a data-remote="true" href="/posts/create_thumb/<%= p.id %>/1" id="increase" class="fa fa-thumbs-o-up" onclick="praiseReplay(this)">
代码解析：
<a data-remote="true" href="/posts/create_thumb/<%= p.id %>/0" id="reduce" class="fa fa-thumbs-up" onclick="praiseReplay(this)">
当a标签中同时有href、onclick两个元素时，先执行onclick中的方法，再执行a标签，所以这句代码的意思为：先执行onclick中的praiseReplay方法，将页面上的赞数减1（此时数据库里面的数据还没变），然后在通过a标签链接找到posts_controller中的
create_thumb方法，通过 /<%= p.id %>/0 这两个参数找到Thumb表中的对应数据，将这条数据的is_thumb字段改为false
