带rails的Hotwire/Turbo :分页

Question

我想用turbo实现一个简单的寻呼系统。

<h1> Title </h1>
<%= turbo_frame_tag "page" do %>
  current page : <%= params[:page] %>
<% end %>
<p> other content </p>
<%= turbo_frame_tag "next" do %>
  <a href="?page=<%= params[:page].to_i + 1 %>">
   Next page
  </a>
<% end %>

得到?page=1

返回(当出现params:page时，控制器呈现部分)

<%= turbo_frame_tag "page" do %>
  current page : <%= params[:page] %>
<% end %>

<%= turbo_frame_tag "next" do %>
  <a href="?page=<%= params[:page].to_i + 1 %>">
   Next page
  </a>
<% end %>

但只有#next元素才能重新加载，

当我将target: "page"添加到#next时，只有第一个turbo框架被重新加载。

我们能把多个目标放到一个turbo_frame_tag上吗?或者有什么正确的方法来做到这一点？

先谢谢你

Answer 1

到目前为止，turbo frame只被一帧(从响应中)取代。如果要替换多个帧，可以使用turbo stream。

因此，您可以将分页next帧移动到page帧中，并且只响应page帧：

<%= turbo_frame_tag "page" do %>
  current page : <%= params[:page] %>

  <p> other content </p>
  
  <a href="?page=<%= params[:page].to_i + 1 %>">
    Next page
  </a>
<% end %>

或者使用turbo-stream

<h1> Title </h1>
<%= turbo_frame_tag "page" do %>
  current page : <%= params[:page] %>
<% end %>
<p> other content </p>
<%= turbo_frame_tag "next" do %>
  <%= button_to "next", query_page_path(page: params[:page].to_i + 1) %>
<% end %>

# pages_controller
def query
  # query pages
  respond_to do |format|
    format.turbo_stream { }
  end
end

# pages/query.turbo_stream.erb
<%= turbo_stream.replace "page" %>
<% end %>

<%= turbo_stream.replace "next" %>
<% end %>

参考资料：https://github.com/hotwired/turbo/issues/56

Answer 2

<%= turbo_frame_tag "page", target "next" do %> 
current page 
<%= params[page] %> 
<% end %> 
<%= turbo_frame_tag "next" do %> 
<a href="?page=<%= params[page].to_i + 1 %>">Next page</a> 
<% end %>