Redux Toolkit中如何删除嵌套多层数组内的指定元素？

核心错误 #

你的代码里用item.value.indexes.splice(Number(key))是错误的——splice的第一个参数是数组索引，而你传入的key是要删除的元素值（1342332），这个值远大于数组的实际索引范围（你的indexes数组只有2个元素，索引为0和1），所以splice根本找不到要操作的位置，自然无法删除元素。

修正后的Reducer代码 #

updateProduct: (state, action: PayloadAction<{ id: string; key: number }>) => {
  const { id, key } = action.payload;

  if (state?.product?.variants) {
    const variantIndex = state.product.variants.findIndex(variant => variant.id === id);
    
    if (variantIndex !== -1) {
      const targetVariant = state.product.variants[variantIndex];
      // 因为metafields始终只有一个元素，直接取第一个即可，无需forEach
      if (targetVariant?.metafields?.[0]) {
        const indexesArray = targetVariant.metafields[0].value.indexes;
        // 先找到要删除元素的索引
        const elementIndex = indexesArray.findIndex(num => num === key);
        
        if (elementIndex !== -1) {
          // 用splice删除该索引的元素，第二个参数1表示删除1个元素
          indexesArray.splice(elementIndex, 1);
        }
      }
    }
  }
}

额外优化点 #

• 类型明确：把PayloadAction<any>改成PayloadAction<{ id: string; key: number }>，避免any类型，提升代码健壮性。
• 简化遍历：既然metafields始终只有一个元素，直接访问metafields[0]即可，不用forEach遍历，减少不必要的循环。
• 修复判断逻辑：原代码里typeof ... !== undefined是错误的，typeof返回的是字符串，应该直接判断对象/数组是否存在（如targetVariant?.metafields?.[0]）。
• 明确splice参数：splice需要两个必要参数（起始索引 + 删除数量），确保调用格式正确。

内容的提问来源于stack exchange，提问作者Alfredo Izquierdo