ReactJS, Хуки - Как установить состояние после функции .map ()?

Question

Я пытаюсь изменить состояние со значениями из массива. Пример:

const [state, setState] = useState({});
const test = [1, 2, 3];
        test.map((item, i) => {
          setState({ ...state, [`item-${i}`]: item });
        });

Текущее состояние:

item-2: 3

Чего я хочу добиться:

item-0: 1,
item-1: 2,
item-2: 3

Я пытался сделать это несколькими способами (все выглядят одинаково), но эффект тот же: / кто-нибудь знает, как его решить?

Спасибо!

Answer 1

Вы можете использовать функциональную версию установленного состояния и уменьшить ее до sh this:

  setState(prevState => {
    return test.reduce((acc, next, i) => {
      return {
        ...acc,
        [`item-${i}`]: next
      },
    }, prevState);
  });

Это имеет преимущество в том, что делает это за один вызов, и его легче читать.

Answer 2

Вы можете обновить состояние, используя метод forEach(), например:

test.forEach((item, i) => {
   setState(state => ({...state, [`item-${i}`]: item}));
});