在 Redux 的嵌套数组中删除匹配的 ID

【问题标题】：Delete Matched Id in Nested Array in Redux在 Redux 的嵌套数组中删除匹配的 ID
【发布时间】：2022-01-04 10:34:02
【问题描述】：

我有一个删除按钮，我设置了一些静态数据。在其中我传递了一些ID。单击按钮时，应删除匹配的 ID。我的问题是我无法删除与其 id 匹配的任何项目。

代码沙盒在这里CLICK HERE

case appConstants.DELETE_IMAGE_SUCCESS:
  return {
    ...state,
    products: state.products.map((product) => ({
      ...product,
      productImages: (product.productImages ?? []).filter(
        ({ id }) => !id.includes(action.payload)
      )
    }))
  };

【问题讨论】：

标签： reactjs redux ecmascript-6 react-hooks

【解决方案1】：

问题在于过滤功能 - 你混淆了String.prototype.includes 和Array.prototype.includes。

正确的做法是在action.payload 中检查productImage.id，反之亦然：

case appConstants.DELETE_IMAGE_SUCCESS:
  return {
    ...state,
    products: state.products.map((product) => ({
      ...product,
      productImages: (product.productImages ?? []).filter(
        ({ id }) => !action.payload.includes(id)
      )
    }))
  };

String.prototype.includes 和 Array.prototype.includes 以类似的方式工作，但具有不同的 API - 第一个接受 string 作为参数，第二个 - Array。

【讨论】：