Проблема с setState с массивом, потеря первой позиции

#javascript #reactjs

#javascript #reactjs

Вопрос:

У меня есть функция, которая получает массив через props. Мне нужно сохранить этот массив в состоянии компонента, поэтому мой компонент выглядит следующим образом:

 ...
const [mediaIds, setMediaIds] = useState();
...

function mediaChange (mediaArray){
    console.log(mediaArray);
    setMediaIds(mediaArray);
    console.log(mediaIds);
}
 

В первой консоли.в журнале я печатаю массив, который поступает через props, во втором я печатаю уже измененное состояние.

Проблема в том, что кажется, что она пропускает первую позицию массива, ниже я покажу свой console.log. Первым из них является mediaArray, а вторым — mediaIds:

 [2, 3]
[2]

[2, 3, 7]
[2, 3]

[2, 3, 7, 4]
[2, 3, 7]


[2, 3, 7, 4, 6]
[2, 3, 7, 4]


[2, 3, 7, 4, 6, 5]
[2, 3, 7, 4, 6]

[2, 3, 7, 4, 6, 5, 1]
[2, 3, 7, 4, 6, 5]

[2, 3, 7, 4, 6, 5, 1, 8]
[2, 3, 7, 4, 6, 5, 1]
 

Комментарии:

1. Можете ли вы предоставить минимальный репозиторий, воспроизводящий эту проблему?

Ответ №1:

useState не является синхронным по многим причинам. Используйте эту useEffect функцию, если вы хотите что-то сделать, когда будет присвоено новое значение.

Прочтите это: https://reactjs.org/docs/hooks-effect.html