Javascript 添加到数组元素后，更改另一个元素，但不添加到数组中

我有一个数组：

dataSet: [
{ name: "Имя1", image: "img.jpeg", author: "Александр Полтавченко", date: "21.02.2020", id: 1 },
      { name: "Имя2", image: "img.png", author: "Александр Полтавченко", date: "21.02.2020", id: 2 },
],
addedToCart: []
     

下面是一个函数，它根据props中的ID将值从

数据集

放入

addedToCart

：

added =  (id) => {

  this.setState (( { addedToCart, dataList  } )=>{

  const newItem = dataList.filter(el=>el.id===id);
  const testArr = [...addedToCart ];
  const filteredATC = testArr.filter((item, el)=>{
    if(addedToCart.indexOf(item)===el){
      item.count++
     return item, el
  }
  else {
    return item
  }

它工作得很好（只有一个元素具有count++），但如果单击“添加到另一个元素”，它只是更改数组中的元素（具有正确的计数）。 如何将另一个元素放入addedToCart，就像

[
{el1},
{el2}
]

---

筛选器返回一个数组而不是所需的元素，您应该使用它

我相信您会希望采用这样的方法：

added = (id) => {

  this.setState (( { addedToCart, dataList } ) => {

    const newItem = dataList.find(el=> el.id === id);
    const testArr = [...addedToCart ];
    const filteredATCIndex = testArr.findIndex((_item, id) => newItem.id === id)

    // if there is an added item
    if (filteredATCIndex !== -1) {
      const count = testArr[filteredATCIndex].count + 1
      testArr[filteredATCIndex] = { ...testArr[filteredATCIndex], count }
      return { addedToCart: testArr }
    }

    // for new item
    const newItemAdded = { ...newItem, count: 1 }
    testArr.push(newItemAdded)
    return { addedToCart: testArr }
  })
}

尽管这种方法会复制数据，但这是不可取的。我建议您将代码< > ADOD ToAtter <代码>改为一个对象，其中键值对分别是从添加项中的ID和计数。这样可以避免重复数据

然后，您的更新状态将如下所示：

added = (id) => {
  this.setState (( { addedToCart } ) => {
    const count = typeof addedToCart[id] === 'undefined' ? 1 : ++addedToCart[id]

    return { addedToCart: { ...addedToCart, [id]: count } }
  })
}