從多維數組中刪除匹配的字符串項

Question

我有一個從復選框值派生的多維數組，對於外部數組的所有實例，它們可以具有相同的字符串。

示例數組：

[
    ['One', 'Two', 'Three'],
    ['One', 'Two', 'Three'],
    ['One', 'Two', 'Three'],
]

當我調用該函數時，我傳遞了一個索引號，該索引號表示我要處理的內部數組之一。 例如，如果用戶在 1 索引中取消選中表示“二”的復選框，我希望多維數組更改為此。

 [
        ['One', 'Two', 'Three'],
        ['One', 'Three'],
        ['One', 'Two', 'Three'],
 ]

我在編寫這個函數時遇到了麻煩。 這是在 React 中，解決這個問題的代碼片段目前是這樣的：

setCheckedValues(prevArray => {
          const newItemArray = prevArray.slice()
          const newItemArrayFiltered = [...newItemArray, newItemArray[index].filter(name => name !== event.target.name)]
          return newItemArrayFiltered
        })

我已經進行了很多搜索，並且對如何僅在一個內部數組中刪除字符串感到困惑。 感謝您的幫助！

Answer 1

處理這個問題的一個相當標准的方法是在索引周圍slice() 。

setCheckedValues(prevArray => {
  return [
    ...prevArray.slice(0, index),
    prevArray[index].filter(name => name !== event.target.name),
    ...prevArray.slice(index + 1)
  ];
});

另一種方法是在數組上使用map()檢查匹配的索引並適當地返回更新的值。

setCheckedValues(prevArray => prevArray
  .map((arr, i) =>
    i === index
      ? arr.filter(name => name !== event.target.name)
      : arr
  )
);