如何在不渲染新 url Rails 6 的情况下实现 link_to、AJAX、remote: true、respond_to

Question

我正在尝试向应用程序添加赞成和反对票，使用按钮或 link_to 远程提交 controller 操作，并使用 AJAX 刷新计数部分。

不知何故，赞成或反对总是重定向到成员的路径。 当我使用head:no_content时，我无法提交又名link_to的表单。 有一些respond_to do | f |... respond_to do | f |...也只是渲染动作 URL。

因此， remote: true有点不起作用，因为我有另一个 controller 使用<%= form_for([entry, entry.review], remote: true, :authenticity_token => true) do |f| %> <%= form_for([entry, entry.review], remote: true, :authenticity_token => true) do |f| %>并且效果很好。

我已经尝试在此处、 此处、 此处、 本教程和本教程中实现，但似乎没有任何效果。

我正在使用acts_as_votable 。 除了 AJAX 的路由功能外，一切正常

# routes.rb
resources :entries do
  member do
    post 'upvote'
    post 'unupvote'
    post 'downvote'
    post 'undownvote'
  end
end

# entries_controller.rb
  def upvote
    @entry.liked_by current_user
  end

  def unupvote
    @entry.unliked_by current_user
  end

  def downvote
    @entry.disliked_by current_user
  end

  def undownvote
    @entry.undisliked_by current_user
  end

# entries/index.html.erb
...
  <%= button_to upvote_entry_path(entry.id), remote: true,
              class: "btn",
              id: "upvote-button-#{ entry.id }" do %>
    <i class="bi bi-hand-thumbs-up" style="color: #ababab;" id="upvote-<%= entry.id  %>"></i>
    <small id="upcount-<%= entry.id %>" >
      <%= render 'entries/upvote', entry: entry %>
    </small>
  <% end %>
...

# entries/_upvote.html.erb
<%= entry.get_upvotes.size %>

# entries/upvote.js.erb
$('#upvote-<%= entry.id %>').className('bi bi-hand-thumbs-up-fill');
$('#upvote-<%= entry.id %>').attr('href', '/entries/<%= entry.id %>/unupvote');
$('#upcount-<%= entry.id %>').html('<%=j render 'entries/upvote', entry: entry %>');

---

编辑，我已将我的link_to更改为button_to ，更改了post路线

Answer 1

不确定您a标签是否在其他元素内，但您可能需要考虑使用button_to而不是link_to 。

Answer 2

到目前为止，临时解决方案（可能不推荐但仍然可以进行工作编程实践）是在特定条件下隐藏和取消隐藏某些元素。

在用户交互时（例如onClick ），在更新类似于 controller 更新的值时取消隐藏和隐藏元素。 只需模拟刷新并更新它们指向的表单路径/控制器操作。

这将主要与 boolean 复选框 forms一起工作得更好，喜欢或不喜欢变量最多只能在两个实例之间交替的地方。 因此，您不必编写太多 javascript 来处理伪输出。

但是，我确信有更好的方法，例如通过Action Cable的WebSockets 。 这可能是矫枉过正，但最接近实时更新。 respond_to似乎不起作用