React set interval pomodoro clock

1

Hi! so started on my pomodoro clock a while ago and been struggling a little bit.
I seem to be getting stuck on using set interval correctly.
codepen link: https://codepen.io/bmansk14/pen/qzoNRd?editors=0010
I used comments as much as possible to help me think out my logic before I wrote any code.
I have tried to do a lot of digging on doc pages and other forums but haven’t come up with much. Most people do it in component did mount and the timer always runs. Obviously i’m
trying to have pause, start, and reset.

Any help would be great!

2

Be aware that setState may be asynchronous for performance reasons.

So a pattern like the one you are using can cause inconsistencies:

setState(something)
this.state.something // this may not be updated yet
doSomething() // maybe something is not updated yet!

Luckily setState accept a callback function as second argument setState, this means that you can call any function that relies on the newState when you are guaranteed it to be updated

For example look at your play function

this.setState({playing:true}, () => this.timerLogic());

This way you know that timerLogic will run after setState is done.
Hope this will help in finding the issue :+1: