setState doesn't do what it suppose to

Question

I'm facing a really strange bug which i have never seen before. I fetch the data from server and i get an array of objects then I'm trying to setState with fetched data but my state is empty! Help someone please.

Answer 1

Updating state in React is not a sync operation. It's async for optimization (to group changes together and change state only once).

You can use useEffect to react on changes:

useEffect(() => { console.log(state)}, [state])

or you can just show your state inside of return (return calls every time when component re-renders, component rerenders because of useState calls).

Answer 2

Updating state in react is an asynchronous operation. You should instead log out data in a useEffect.

useEffect(() => {
  console.log(state)
}, [state]);