-1

Sometimes setState doesnt working all by itself and i am adding small timeouts to do it. My first question is;

1-) Why setState sometimes doesnt working without a delay?

2-) Is it correct to add setTimeout? - And its small amount of delay like 10 ms, its nothing, but it makes my code to work and state to update.

When i was coding in Angular1, we were using $timeout sometimes for scope to apply this changes. But it was okay to do so, in React i am not sure about this.

Any help would be appreciated, thanks.

jrSakizci
  • 171
  • 2
  • 14
  • Could you please provide a few lines of code of what are you trying to achieve? – CapitanFindus Apr 16 '18 at 06:42
  • setState is asynchronous. Meaning setState doesnt guarantee that this.state.property will immediately reflect the updated value. There is a callback param in setState that will be fired after state update. – Subin Sebastian Apr 16 '18 at 06:45
  • Are you calling `setState` in the constructor of a class component? – maioman Apr 16 '18 at 06:45
  • @CapitanFindus - Actually it is very simple. Just try to updating state but without setTimeout it isnt working, what can cause this? – jrSakizci Apr 16 '18 at 06:46
  • Can you please show your relevant code. It looks like a possible duplicate of https://stackoverflow.com/questions/41278385/setstate-doesnt-update-the-state-immediately/41278440#41278440 – Shubham Khatri Apr 16 '18 at 06:46
  • @ssk - I know, but what can callback actually do? I am console.logging some success message, it is coming but its still not updating state value. – jrSakizci Apr 16 '18 at 06:47
  • instead of setTimeout try console logging in setState callback. For Eg: `this.setState({name: 'abc' }, () => console.log(this.state.name))` – Subin Sebastian Apr 16 '18 at 06:52
  • @ssk - it is says and shows changed state but at first change, it is not showing in view. just in state. in view it turns to default state again. strange behaviour. i wonder what can cause this behaviour – jrSakizci Apr 16 '18 at 07:15
  • 2
    Show us your code! Stop wondering what causes this behavior, show us your code so we can help! – ChrisR Apr 16 '18 at 08:00

2 Answers2

0

It sounds like you're attempting to call setState in a render. This is bad because render occurs immediately following state updates. It causes a render loop. You should not use a setTimeout to do this either. That causes React to stop warning you because it can no longer detect the issue. This will cause large random bugs in your app.

Your symptoms are a sign that you need to push the state up into container components.

cchamberlain
  • 17,444
  • 7
  • 59
  • 72
-1

The reason why there is a delay in setting the state is that 3 lifecycle method of ReactJS are called while setting the state. setTimeout is a way to get the current value of the state which has just been set, However another alternative would be that you can create a callback function inside the setState to get the current value. Use of setTimeout must be always be avoided until and unless there is no other alternative.

example: this.setState({show:true},()=>{console.log(this.state.show)})

Erick
  • 1,098
  • 10
  • 21
  • setTimeout is not a good way to get the value of state. React batches state updates. It may or may not have been set when the setTimeout executes. – cchamberlain Apr 16 '18 at 11:49