反应 function 不更新 state

Question

我想在 startStop() 开始时，“secs”将等于“remaining”。 然后在间隔结束时将 state “剩余”设置为等于“秒”。 但是，“secs”确实每 1000 毫秒更新一次，但“remaining”的 setState 实际上并没有更新。 它是否与嵌套 function decrement() 内的 secs 仅更新有关？ 如何让“剩余”更新？

class App extends Component {
  state = {
    timerState: "paused"
    remaining: 1500,
  }

startStop() {
    
    var secs = this.state.remaining

    function getminutes()  
      return Math.floor(secs / 60)
    }

    function getseconds() { 
      return secs - Math.round(getminutes() * 60)
    } 

    function appendZero(number) {
      if (number <= 9)
        return "0" + number
      else
        return number
    }

    const decrement = () => {
        document.getElementById("minutes").innerHTML = appendZero(getminutes())
        document.getElementById("seconds").innerHTML = appendZero(getseconds())
        secs = secs - 1
    }

    if (this.state.timerState === "paused") {
      this.setState({
        timerState: setInterval(() => decrement(), 1000)
      }, 
      this.setState({
        remaining: secs
      })
    }
    
    else if (this.state.timerState !== "paused") {
      clearInterval(this.state.timerState)
      this.setState({
        timerState: "paused"
      })
    }

    this.setState({
      remaining: secs
    })
  }

Answer 1

改变这个

   this.setState({
            timerState: setInterval(() => decrement(), 1000)
          }, 
          this.setState({
            remaining: secs
          })

至：

this.setState({
        timerState: setInterval(() => decrement(), 1000),
        remaining: secs
      })

Answer 2

让它工作。 我将 setState 移动到 increment() 如下：

const decrement = () => {
        document.getElementById("minutes").innerHTML = appendZero(getminutes())
        document.getElementById("seconds").innerHTML = appendZero(getseconds())
        secs = secs - 1
        this.setState({
          remaining: secs
        })
    }

仍然不明白为什么如果 setState() 在 startStop() 末尾作为我的原始问题它不起作用？