собрать вложенные массивы в один

Question

в состоянии allBrands хранится массив с структурой(на картинке). Это массив объектов(брендов), каждый из которых содержит массив устройств (device_list) я хочу собрать все массивы устройств(device_list) в allDeviceList

Вот код, проблема в том что в результате в allDeviceList попадает только последний массив device_list, получается что они не накапливаются, а нужно собрать все массивы device_list в allDeviceList

const [allBrands, setAllBrands] = useState([])
const [allDeviceList, setAllDeviceList] = useState([])   
 
allBrands.map(
  (brand) =>
    (setAllDeviceList ([
      ...allDeviceList,
      ...brand.device_list
    ]))
)

Answer 1

Array.prototype.map возвращает массив с тем же количеством элементов. Вам же нужно собрать все элементы вместе в один массив -- значит, нужно использовать Array.prototype.reduce (ну или цикл for и мутировать копию массива). Привожу пример на чистом JS. Думаю, Вам не составит труда адаприторовать его под React и useState. Детальнее про методы массивов (в т. ч. Array.prototype.reduce) можно почитать в официальной документации.

const brands = [
  {
    id: 1,
    name: "Nokia",
    devices: [
      { id: 1234, name: "X40" },
      { id: 1235, name: "X42" },
      { id: 1236, name: "X53" },
      { id: 1237, name: "93" },
      { id: 1238, name: "96 Ultra" }
    ]
  },
  {
    id: 2,
    name: "Xiaomi",
    devices: [
      { id: 12, name: "POCO X3" },
      { id: 13, name: "13" },
      { id: 14, name: "Mi 8T" },
      { id: 15, name: "Mi 10" }
    ]
  },
  {
    id: 3,
    name: "Samsung",
    devices: [
      { id: 1, name: "Galaxy S12" },
      { id: 2, name: "Galaxy S13" },
      { id: 3, name: "Galaxy S14" },
      { id: 4, name: "A32" },
      { id: 5, name: "J303" },
      { id: 6, name: "J7" }
    ]
  }
];

const devices = brands.reduce((acc, brand) => {
  const devices = brand.devices.map((device) => ({
    ...device,
    name: `${brand.name} ${device.name}`
  }));

  return acc.concat(devices);
}, []);

console.log(devices);

БЛОГ НА HUSL

собрать вложенные массивы в один

Ответы (1 шт):