How to reset the stopwatch and start counting again when clicked?

Question

React

It is not possible to restart the stopwatch when clicking on reset, it resets to 0 and starts counting from the previous state. Need it to reset the time and start counting from 0, help

function App() {
  const [time, setTime] = useState({h:0, m:0, s:0})
  const [interv, setInterv] = useState()
  const [status, setStatus] = useState(0)
  var updatedSec = time.s, updatedMin = time.m, updatedHour = time.h

  const start = () => {
    run()
    setStatus(1)
    setInterv(setInterval(run, 1000))
  };

  
  const run = () => {
    if (updatedMin === 60) {
      updatedHour++;
      updatedMin = 0
    }
    if (updatedSec === 60) {
      updatedMin++;
      updatedSec = 0
    }
    updatedSec++;
    return setTime({ h: updatedHour, m: updatedMin, s: updatedSec })
  }

  const wait = () => {
      clearInterval(interv)
      setStatus(2)
  }

  const stop = () => {
    clearInterval(interv)
    setStatus(0)
    setTime({h:0, m:0, s:0})
  }
  
  const reset = () => {
    clearInterval(interv)
    setTime({ h: 0, m: 0, s: 0 })
    start()
  } 
  return (
    <div className="main-section">
      <div className="clock-holder">
        <div className="stopwatch">
          <DisplayComponent time={time}/>
          <BtnComponent start={start} wait={wait} stop={stop} reset={reset} status={status}/>
        </div>
      </div>
    </div>
  );
}

Answer 1

Some kind of game - why do you need to store the number of minutes and hours? Seconds are enough (yes, they will not be 0-59, but as many as you like), minutes and hours are calculated if necessary.

is reset to 0 and starts counting from the previous state

Not surprisingly, the run method works with "undumped" data. To have access to the current state, use the functional update .