Turbo 流尝试渲染为产量而不是 turbo 帧

Turbo stream trying to render into yield instead of turbo frame

提问人:Dmitrii Sumenko 提问时间:11/17/2023 最后编辑:James HibbardDmitrii Sumenko 更新时间:11/17/2023 访问量:62

问:

尝试在 Rails 7 中使用 Turbo 完成阻止解锁用户功能。我是新手,所以请耐心等待我。

<%= turbo_frame_tag "block_unblock_button" do %>
        <% if @is_blocked_by_current_user %>
          <%= link_to unblock_profile_path(@user), data: { turbo_method: :delete, turbo_frame: "block_unblock_button" },remote: true, class: "btn btn-outline-primary mb-1 col-6 d-md-block mx-auto" do %>
            Unblock
          <% end %>
        <% else %>
          <%= link_to block_profile_path(@user), data: { turbo_method: :post, turbo_frame: "block_unblock_button" },remote: true, class: "btn btn-outline-primary mb-1 col-6 d-md-block mx-auto" do %>
            Block
          <% end %>
        <% end %>
      <% end %>

这是我的观点,我需要用 Turbo 替换

resources :profiles do
    member do
      post 'block'
      delete 'unblock'
    end
  end

这些是路线

block.turbo_stream.erb

<%= turbo_stream.replace "block_unblock_button" do %>
  <%= link_to unblock_profile_path(@user), data: { turbo_method: :delete, turbo_frame: "block_unblock_button" }, remote: true, class: "btn btn-outline-primary mb-1 col-6 d-md-block mx-auto" do %>
    Unblock
  <% end %>
<% end %>

unblock.turbo_stream.erb

<%= turbo_stream.replace "block_unblock_button" do %>
  <%= link_to block_profile_path(@user), data: { turbo_method: :post, turbo_frame: "block_unblock_button" }, remote: true, class: "btn btn-outline-primary mb-1 col-6 d-md-block mx-auto" do %>
    Block
  <% end %>
<% end %>

控制器:

def block
    @user = User.find(params[:id])
    current_user.blocked_users.find_or_create_by(blocked_id: @user.id)
    @is_blocked_by_current_user = true

    respond_to do |format|
      format.turbo_stream
      format.html { redirect_to profile_path(params[:id]) }
    end
  end

  def unblock
    @user = User.find(params[:id])
    current_user.blocked_users.find_by(blocked_id: @user.id).destroy
    @is_blocked_by_current_user = false

    respond_to do |format|
      format.turbo_stream
      format.html { redirect_to profile_path(params[:id]) }
    end
  end

例如,当我单击阻止时,它会发送带有 Turbo 的 POST,200ok 响应,出现取消阻止按钮。当我尝试单击它时,它会使用 Turbo 发送删除请求,我可以单击多次,但它仍然发送删除请求。当我在浏览器开发工具中检查“元素”选项卡时,我注意到它试图将我的框架插入我的布局中,而不是屈服,这是一个屏幕:

I would type it, but it desappears

例如,当我单击阻止时,它会发送带有 Turbo 的 POST,200ok 响应,出现取消阻止按钮。当我尝试单击它时,它会使用 Turbo 发送删除请求,我可以单击多次,但它仍然发送删除请求。当我在浏览器开发工具中检查“元素”选项卡时,我注意到它试图将我的框架插入我的布局中,而不是屈服,这是一个屏幕:

I would type it, but it desappears

理想情况下,涡轮流应该在涡轮机架中插入正确的按钮,但事实并非如此。

Ruby-on-Rails 涡轮增压

评论


答:

0赞 Alex 11/17/2023 #1

您有一些不必要的额外代码:

# no need for turbo frame
<%= turbo_frame_tag "block_unblock_button" do %>

# even with the turbo frame, you don't have to specify it if link is inside the frame
turbo_frame: "block_unblock_button"

# this does nothing
remote: true

<div id="block_unblock_button">
  <% if @is_blocked_by_current_user %>
    <%= link_to "Unblock", unblock_profile_path(@user), data: {turbo_method: :delete} %>
  <% else %>
    <%= link_to "Block", block_profile_path(@user), data: {turbo_method: :post} %>
  <% end %>
</div>

你不想,你想要内容:
https://stackoverflow.com/a/73395858/207090
replaceupdate

# block.turbo_stream.erb

<%= turbo_stream.update "block_unblock_button" do %>
  <%= link_to "Unblock", unblock_profile_path(@user), data: {turbo_method: :delete} %>
<% end %>
# unblock.turbo_stream.erb

<%= turbo_stream.update "block_unblock_button" do %>
  <%= link_to "Block", block_profile_path(@user), data: {turbo_method: :post} %>
<% end %>