无法在 Rails 应用的 Ruby 中检索到正确的目标值

Question

我正在构建一个简单的购物车应用程序并使用 Stimulus JS 来处理 Rails 视图和 Javascript 逻辑之间的交互。

在购物车页面中，我通过在 UI 中循环显示产品，如下所示：


<% @curr_cart.items.each do |item| %>

     <span id="test" data-target="cart.count">

        <%= item.quantity %>

     </span>

我正在尝试添加一个 'delete' 功能，用于从购物车中删除商品。我的移除逻辑工作正常，但我无法更新正确项目的数量。每次我删除产品时，只有 第一个 项的数量会减少。

这是我更新的方式：

this.countTarget.innerHTML = Number(this.countTarget.innerHTML)- 1;

尝试使用值和数据属性但没有成功:皱眉:

今天大部分时间都在尝试解决这个问题，但没能成功。关于如何解决这个问题的任何想法或建议？

谢谢！

Answer 1

根据您发布的代码和描述，我想您正在为所有购物车商品使用刺激控制器的一个实例。像这样：

<div data-controller="cart-items">
  <% @curr_cart.items.each do |item| %>
    <span id="test" data-target="cart.count">
      <%= item.quantity %>
    </span>
    ...
    other fields
    ...
  <% end %>
</div>

这种方法有一个问题，您必须弄清楚要编辑的项目并更改正确的字段。据我了解，项目不应相互依赖。我建议您每行使用一个刺激控制器实例：

<% @curr_cart.items.each do |item| %>
  <div data-controller="cart-item">
    <span id="test" data-target="cart.count">
      <%= item.quantity %>
    </span>
    ...
    other fields
    ...
  </div>
<% end %>

现在在 JS 控制器中每一行都绑定到自身，您不必在 countTargets 数组中搜索特定行，每行中只有一个 countTarget。这应该可以解决您的问题。缺点是线路不能互通，如果需要可以通过其他刺激控制器实现。

无法在 Rails 应用的 Ruby 中检索到正确的目标值

Unable to retrieve correct target value in a Ruby on Rails app

javascript

ruby-on-rails

stimulusjs