时间戳

首页 > 解决方案 > 如何将 aa 参数传递给 map() 函数中的事件处理程序？

reactjs - 如何将 aa 参数传递给 map() 函数中的事件处理程序？

问题描述

以下例程在选中或取消选中复选框时调用事件处理程序：

        {deliveries.map((x) => (
          <tr>
            <td className="dataTableCell">
              <input type="checkbox" 
              onChange={(x) => {
                this.setSelectedDelivery({x.DeliveryId})
              }} />
            </td>
          <tr>
        ))}

我尝试将 x.DeliveryId 参数作为 x.DeliveryId 和 {x.DeliveryId} 传递，但这些方法都不起作用。我需要如何构建此代码才能成功地将 x.DeliveryId 值作为参数传递给事件处理程序？

标签： reactjs

解决方案

我猜当你在做的时候：

onChange={(x) => { this.setSelectedDelivery({x.DeliveryId}) }}

该x值被 onChange 方法的事件覆盖，这就是x.DeliveryId失败的原因，因为event（在这种情况下x）没有该DeliveryId属性。

解决它的一种方法是向您onChange的方法添加两个参数，一个用于事件，另一个用于您传递的变量，以防您使用 的任何属性event：

onChange={(event, x) => { this.setSelectedDelivery(x.DeliveryId) }}

我您没有使用任何属性，event只是不要将任何参数传递给您的onChange方法：

onChange={() => { this.setSelectedDelivery(x.DeliveryId) }}

编辑： 我不确定如何setSelectedDelivery构建，但我可以看到你正在传递一个objectwithout values，但我认为你只需要id这就是为什么你看到你在评论中提到的错误，所以你必须通过x.DeliveryId给你的setSelectedDelivery

推荐阅读