在 Ruby on Rails 中使用 ActionCable 更新多个 div 的最佳实践是啥？

Posted 2023-02-16

【中文标题】在 Ruby on Rails 中使用 ActionCable 更新多个 div 的最佳实践是啥？

【英文标题】：What are the best practices of updating multiple divs with ActionCable in Ruby on Rails?在 Ruby on Rails 中使用 ActionCable 更新多个 div 的最佳实践是什么？

【发布时间】：2018-12-26 08:05:59

【问题描述】：

我有一个 Ruby on Rails 网站。其中一个索引页有一个包含多行的表。我还有一个后台作业，它对每一行执行某些操作，每行大约需要 5-10 秒。

当后台作业中的处理完成后，我想将每一行的状态从“处理中...”更新为“完成”。

我正在考虑使用 Action Cable 进行更新，但迄今为止我只使用 Action Cable 来更新页面上的一个元素，而不是多个元素。

我想知道设置代码以更新每行状态的正确方法是什么。是否必须为每一行单独打开一个频道？

【问题讨论】：

如果有帮助请查看github.com/jrpolidario/live_record

您好，您不会为表格的每一行打开一个频道，您只是在每组更新后向该页面的频道广播。使用 ActionCable，您可以取回 JSON 格式的对象。然后，您可以使用 javascript 循环遍历该列表并更新您的 UI（基于 id 或其他独特的信息）。或者您可以取回包含 html 的 json 响应并替换该行。这里有一些很好的动作电缆指南guides.rubyonrails.org/action_cable_overview.html，blog.heroku.com/…

【参考方案1】：

绝对可以。而且您不必为每一行打开通道。只需使用状态已更改的作业 ID 和表中具有相同 ID 的对应行。

ActionCable.server.broadcast "job_status_update", job_id: 'xxxxx', status: 'complete'

.html

<table>
  <% jobs.each do |job|%>
   <tr>
     <td id="<%= job_id %>">
     <%= job.status %>
     </td>
   </tr>
 <% end %>
</table>

.咖啡

App.chatChannel = App.cable.subscriptions.create  channel: "JobChannel" ,
   received: (data) ->
     $(data.job_id).innerText(data.status)

【讨论】：

Guadam 的回答和 Kick 的回答都有效。谢谢！