我们还需要在 React 钩子中使用函数式 setState 方式吗？

Question

  const [count, setCount] = useState(0);

  const handleClick = () =>
    setCount(prevCount => {
      return prevCount + 1;
    });

  const [count, setCount] = useState(0);

  const handleClick = () => setCount(count + 1);

来自基于类的组件背景，它成为我们使用功能性的习惯setState。我想知道我们是否还需要在功能钩子中依赖 prevState ？或者当前状态始终是“可信赖的”和最“更新的”？

Answer 1

是的，行为是相似的。

React 正在批处理更新调用。写作时：

const handleClick = () => setCount(count + 1)
handleClick()
handleClick()
handleClick()

的count状态将是1

写作时：

const handleClick = () =>
  setCount(prevCount => {
    return prevCount + 1;
});
handleClick()
handleClick()
handleClick()

的count状态将是3