刺激：如何处理具有相同目标名称的重复项目

Question

我有一个项目列表，每个项目都有一个 link 可以单击以进行编辑。我正在使用刺激使编辑 "modal" 表单在他们单击该编辑 link 时可见。将要编辑的内容的 ID 作为 id= 出现在列表

的相应 link 标签上

所以，编辑 link 看起来像这样：

<td><a data-action="click->content#edit" data-target="content.editBtn" id="<%= url_for(content) %>")>Edit</a></td>

想法是刺激控制器中的 content#edit 操作检查并找到它的 id，并使用它来编辑正确的行。

然而我遇到的问题是，我认为，结果这个列表的所有行都有一个同名的数据目标，错误的（第一个？）绑定到目标..

但是，如果我想让每个数据目标不同，例如将 id 附加到它，现在我在 controller.js 中有一长串目标，所以这没有意义。

呸，我希望你跟上了。怎样处理才是正确的？

Answer 1

如果您使用 Rails 作为后端，就像您的其他问题似乎表明的那样，可能会有更简单的非 Stimulus 解决方案。要使用 Stimulus，您需要从服务器或 DOM 获取该项目的数据，将其显示在表单中，然后通过 [=20= 将具有正确 ID 的正确表单提交给服务器].为什么不为每个项目都设置一个远程 link_to 按钮来执行 edit 操作？ Rails 获取对 edit 控制器操作的 JS 请求，您可以使用从 Ruby 对象获得的数据加载模态表单。

如果您将 Stimulus 用于表单上的任何内容，我会利用这个机会制作一个 Stimulus 控制器来监听 ajax->send/error/complete 事件并自动 disables/enables 按钮，在按钮上设置加载微调器, 并关闭模态。这些将是很好的领域，可以加入一些 Stimulus 变得非常简单的功能。

Answer 2

这实际上是 Stimulus 的一个很好的用途，因为它是模块化的。您为每一行添加一个控制器，而不是让控制器围绕页面或 table.

<tr data-controller="content">
  <td>
    <a data-action="click->content#edit" data-target="content.editBtn" id="<%= url_for(content) %>")>
      Edit
    </a>
  </td>
</tr>

刺激：如何处理具有相同目标名称的重复项目

Stimulus: how to handle repeating items with the same target name

javascript

stimulusjs