Блог

Вот объекты массива состояний:

  const [items, setItems] = useState([
   {
    id: 1,
    completed: true
   },
   {
    key: 2,
    complete: true
   },
   {
    key: 3,
    complete: true
   }
    ])
 

одним отправлением я хочу добавить новый объект и одновременно изменить свойство pervious объекта завершено на false, короче говоря, я хочу получить этот результат:

   const [items, setItems] = useState([
   {
    id: 1,
    completed: true
   },
   {
    key: 2,
    complete: true
   },
   {
    key: 3,
    complete: false
   },
   {
    key: 4,
    complete: true
   }
    ])
 

Я понимаю, как добавить новый объект:

   const handleSubmit = e => {
    setItems([
      ...items,
      {
        key: 4,
        complete: true
      },
    ]);
  }
 

Но, как я уже упоминал выше, возможно ли обновить предыдущий объект также с помощью одной отправки? Заранее спасибо!

 function updateItems(newItem, completedId){
    setItems(prevItems =>{
        const result = prevItems.map(item =>{
            if(item.id !== completedId) 
                return item

            return {...item, complete : true}
        })

        return result.concat(newItem)
    })
}
 

Чтобы массив идентификаторов был проверен как полный, вы могли бы сделать

if(completedIds.includes(item.id)

возможно, вы можете использовать это, скопировать состояние, а затем выбрать последний завершенный объект и изменить его. после этого вы можете установить элементы()

 const handleSubmit = e => {
     const tempItems = [...items];
     tempItems[items.length - 1].complete = false;
     setItems([...tempItems,{key: 4,complete: true}]);
}
 

вместо написания ключа вручную

 setItems([...tempItems, {key:items.length   1, complete:true}])