基于Stimulus Reflex实现商家点赞功能并完善LikesReflex控制器

核心逻辑说明 #

已经搭建完成的三方模型关联本身就支持点赞记录自动归属到对应用户的user.likes集合，只需要补充权限校验、状态切换逻辑，搭配前端状态同步即可完成功能。

完整LikesReflex代码 #

class LikesReflex < ApplicationReflex
  # 仅允许登录用户触发点赞操作
  before_reflex :require_login, only: [:like]

  def like
    business = Business.find(element.dataset[:id])
    # 匹配当前用户对该商家的已有点赞记录
    existing_like = business.likes.find_by(user: current_user)

    if existing_like
      # 已点赞则删除记录，自动从当前用户的likes集合中移除
      existing_like.destroy
    else
      # 未点赞则创建记录，自动写入当前用户关联，归属到user.likes集合
      business.likes.create!(user: current_user)
    end
  end

  private

  def require_login
    # 未登录用户直接中断操作，可搭配flash做前端提示
    throw :abort unless current_user
  end
end

关键点：Rails的关联方法会自动同步外键字段，只要创建/删除Like记录时指定对应用户，不需要手动修改user.likes的关联对象，操作会自动同步到数据库与关联集合中。

前端页面配套调整 #

为了实现操作后实时同步按钮状态，需要修改商家详情页的按钮代码，替换原来的静态文案：

<%# business/show.html.erb 文件内 %>
<%# 登录状态下判断当前用户是否已给该商家点赞 %>
<% liked_flag = @business.likes.exists?(user: current_user) if user_signed_in? %>

<%= button_tag(
  "#{liked_flag ? '取消点赞' : '点赞'} (#{@business.likes.count})",
  data: {
    reflex: "click->Likes#like",
    id: @business.id
  },
  class: liked_flag ? "liked active" : ""
) %>

触发Reflex执行后，StimulusReflex会自动重新渲染当前页面片段，同步更新按钮文案、样式和实时点赞数，无需额外编写前端交互逻辑。

常见注意点 #

• 原代码使用的find_or_create_by仅适合单向永久点赞的场景，若需要支持取消点赞，必须替换为上述的已存在记录判断逻辑
• 未登录用户点击按钮时可以在require_login方法中设置flash提示，配合页面的flash渲染区块即可给用户反馈
• 若担心商家ID被恶意篡改，可以在Business.find时增加权限校验，避免跨操作触发无效查询

内容的提问来源于stack exchange，提问作者foliwe83