Блог

Я создаю интернет — магазин. Продукт имеет атрибуты (в данном случае компьютер iMac имеет такие атрибуты, как емкость, функции usb и цифровая клавиатура). Я храню атрибуты в своем состоянии.

Проблема в том, что каждый раз, когда я переключаюсь, например, с емкости 256 ГБ на емкость 512 ГБ, он добавляет в массив совершенно новый объект {capacity:"512GB"} .

Как настроить функцию обработчика (код ниже) таким образом, чтобы она условно проверяла, есть ли у объекта в массиве уже ключ «Емкость», и обновляла его до нового выбора вместо добавления другого объекта? Я перепробовал все, я в отчаянии

обработчик получает объект с парой ключ-значение, а также сам ключ (как label ) и тип. В этом случае тип можно игнорировать.

 const handleAttributeChange = (object, type, label) =gt; {  if (type == "text") {  this.setState({  selectedAttributes: {  id: id,  text: [...this.state.selectedAttributes.text, object],  swatch: this.state.selectedAttributes.swatch,  },  });  } else if ((type = "swatch")) {  this.setState({  selectedAttributes: {  id: id,  text: this.state.selectedAttributes.text,  swatch: [...this.state.selectedAttributes.swatch, object],  },  });  }  };   

Вместо массива вы можете использовать объекты со значениями ключей diff. Если ключи уникальны. Позже вы сможете преобразовать его в список значений.

 let obj = {};  const update = (o) =gt; {  obj = { ...obj, ...o }; };   /* In case you know key, value */ const update2 = (key, value) =gt; {  obj[key] = value; };  console.log(obj); update({ a: 1 }); update({ b: 2 }); console.log(obj); // { a: 1, b: 2 } update({ a: 3 }); console.log(obj); // { a: 3, b: 2 }  console.log(Object.entries(obj).map(([key, value]) =gt; ({ [key]: value })));  //[ { a: 3 }, { b: 2 } ]