在本应用里,哪些地方需要用到 Ajax 技术呢?
收藏和点赞功能;
评论功能;
‘我的主页’中的部分内容的显示(我的文章,我的收藏等);
app/views/favorites/_favorite_link.html.erb 中
发起一个 Ajax 的请求,只需要在 link_to 中添加 remote: true 这个参数,点击链接的时候,发往控制器的就是 Ajax 请求,使用 Javascript 处理:
<%= link_to favorites_path(article_id: @article.id), method: :post, remote: true do %>
点击收藏链接后,POST 请求被 FavoritesController 的 create 方法作为 JS 来处理:
class FavoritesController < ApplicationController def create @article=Article.find(params[:article_id]) current_user.favorites.create(article_id:params[:article_id]) render :favorite end def destroy favorite = Favorite.find(params[:id]) @article = favorite.article favorite.destroy render :favorite end end
create 方法执行完毕后,会寻找合适的模版来渲染,新建一个 favorite.js.erb
视图文件,编写在客户端执行的 JS 代码:
$("#favorite").html("<%= escape_javascript(render partial: 'favorite_link') %>");
这是一段 jQuery 代码,意思是获取第一个匹配 id="favorite"
的元素,设其元素的 html 内容为渲染的 favorite_link 页面。
app/views/articles/show.html.erb
<div id="favorite" class="col-md-4 text-left"> <%= render 'favorites/favorite_link' %></div>
jQuery 会根据 id 找到这段代码,并替换其中的内容。
这样一来,我们就通过 Ajax 技术实现了局部更新。