Я хочу передать данные из массива A в объект B, поэтому я делаю что-то вроде [array] .forEach (e => setB ({... B, e})), но похоже, что при переходе к более поздним элементам , прежние действия были ...

2
theotheo 14 Янв 2021 в 11:05

2 ответа

Лучший ответ

Ты прав. При регулярном обновлении состояния значения в цикле каждое последующее обновление в очереди перезаписывает предыдущее обновление, поэтому последнее обновление используется для следующего цикла визуализации.

Решение

Обычно вы должны использовать обновление функционального состояния для обновления из предыдущего состояния, а не состояния из предыдущего цикла рендеринга. В этом случае имеет смысл сопоставить состояние arrayA с массивом пар ключ-значение и выполнить одно обновление для состояния objB.

React.useEffect(() => {
  setB(Map(arrayA.map(num => [num, num * num]));
}, []);
2
Drew Reese 14 Янв 2021 в 08:13

Вы получаете stale data, и вам следует использовать setState callback следующим образом:

export default function App() {
  const [arrayA, setA] = React.useState([1, 2]);
  const [objB, setB] = React.useState(Map({}));
  React.useEffect(() => {
    arrayA.forEach((num) => {
      setB(oldValue => oldValue.set(num, num * num));
    });
  }, []);

  return <div>null</div>;
}
1
Taghi Khavari 14 Янв 2021 в 08:10
65715339