如何从 React 中的状态数组中按索引删除项目

Question

我想在React中从一个对象数组中删除一个对象到另一个数组中，但是我有点困惑，到目前为止我可以将一个对象推入数组中。但升技很困惑如何通过索引删除它。

数据

const addValues = [
  {
    "name": "New 1",
    "Value": [98,15,7,8]
  }, 
  {
    "name": "New 2",
    "Value": [7,18,9,40]
  },
  {
    "name": "New 3",
    "Value": [0,19,50,98]
  },
  {
    "name": "New 4",
    "Value": [56,89,34,20]
  },
]

const [value, setValue] = useState([]);

const handlePush = () => {
  setValue(oldArray => [...oldArray, newValue]);
};

 <div>{addValues?.map((inside, index) => {
    return (
      <React.Fragment key={index}>
         <p>{inside.name} <button onClick={() => setTags(oldArray => [...oldArray, addValue[index]])}>Add</button></p>
       </React.Fragment>
    )
  })}</div>

Answer 1

如果您想要不可变数组的子集，则称为操作filter。要按索引删除一项，您只需要过滤逻辑来过滤掉一个特定的索引。

例如：

const handleRemove = (removeIndex) => {
  setValue(oldArray => {
    return oldArray.filter((value, i) => i !== removeIndex)
  })
}