Question

鉴于您可以通过传递箭头功能（例如下面的秒表功能）来更改当前状态时访问上一个状态：

function App() {
   const [time, setTime] = useState(0)

function counter() {
   setTime(prev => prev + 1)
}

return (
<div>
 <p>{time}<p>
 <button onClick={counter}>Click Me<button/>
</div>
)

}

当状态是对象时，我可以这样做吗？这是我遇到的语法问题还是无法解决？在有问号的地方我该怎么写？

function App() {
   const [time, setTime] = useState({sec: 0, min: 0, hour: 0})

function stopwatch() {
   setTime(prev??? => ????)
}

return (
<div>
 <p>{time.sec} {time.min} {time.hour}<p>
 <button onClick={stopwatch}>Click Me<button/>
</div>
)

}

```

Answer 1

我认为您应该将它们分开，因为分钟，秒和小时在不同的时刻会增加。例如，如果您想在几分钟内进行更改，则可以将此逻辑应用于对象

function App() {
   const [time, setTime] = useState({sec: 0, min: 0, hour: 0})

function stopwatch() {
  setTime(prevTime => {
  return {
     ...prevTime,
     minutes: prevTimes.minutes + 1 // or you could directly change it..
  }  
})
}

return (
<div>
 <p>{time.sec} {time.min} {time.hour}<p>
 <button onClick={stopwatch}>Click Me<button/>
</div>
)

}

此逻辑可应用于您要进行的每一次更改，分钟，秒和小时，仅几小时等。

以状态为对象访问功能组件的先前状态

1 个答案: