如何使用 Turbo/Stimulus 为新记录插入表单？答案

【问题标题】：How to insert a form for a new record using Turbo/Stimuls?如何使用 Turbo/Stimulus 为新记录插入表单？
【发布时间】：2021-09-09 17:55:52
【问题描述】：

Rails 的未来似乎正在从 UJS 转向 Turbo 和 Stimulus。但是，与老式 UJS 相比，某些功能似乎需要更多代码和更多工作。

例如：要插入允许创建新记录的内联表单，您可以创建如下链接：

link_to 'add record', new_user_path, remote: true

然后，在控制器中：

def new
  @user = User.new
  respond_to do |format|
     format.js
  end
end

最后是一个 new.js.erb 视图，其中包含为响应新操作而要执行的内容（表单）。

人们会认为只需响应以下内容即可轻松转换为 Turbo：

def new
  @user = User.new
  respond_to do |format|
     format.turbo_stream
  end
end

然后将 new.js.erb 更改为 new.turbo_stream.erb，内容如下：

<turbo-stream action='append' target="<%= dom_id @user %>_new_form">
  <template>
      ...the user form stuff...
  </template>
</turbo-stream>

但是，Turbo Streams 不处理 GET 请求。所以，这种方法行不通。

我的问题是：Rails 7 的处理方式是什么？我不认为 UJS 是答案，因为 Turbo 和 Stimulus 正在“取代”UJS 功能。也许，答案是使用 Stimulus 插入新表单，然后当表单在创建操作中成功时，使用流在 POST 请求之后插入后续新记录。但是，这似乎比 UJS 是/过去的工作要多得多。这让我觉得必须有一种更简单、更流畅、更少代码的方式来处理这个问题。

【问题讨论】：

标签： ruby-on-rails ruby-on-rails-6 hotwire-rails turbo

【解决方案1】：

为此，我会使用turbo-frames：

首先创建一个名为new_record的空turbo-frame
然后你可以有一个链接并设置data-turbo-frame="new_record"

这就像您点击了 new_record turbo-frame 内的链接一样
然后在新模板上有一个匹配的turbo-frame 包装你的表单，然后
当您单击新记录按钮时，它会将新记录表单放在原处我会说这是热线方式。

【讨论】：