反应状态第一次没有立即更新答案

【问题标题】：React state is not updating immediately for first time反应状态第一次没有立即更新
【发布时间】：2022-11-22 14:22:25
【问题描述】：

我应该显示文字“我是可见的“在切换按钮时意味着当有人第一次点击它时它应该显示文本然后如果再次点击它应该被隐藏然后如果有人再次点击按钮它应该像那样可见。

import React, { useState } from "react";

const App = () => {
  const [open, setOpen] = useState(false);
  let length = 0;
  const handleOpen = () => {
    if (length === 0) {
      setOpen(false);
    } else {
      setOpen(true);
    }
    length++;
  };
  return (
    <>
      {open && <div> I am visible </div>}
      <button onClick={handleOpen}> change visibility </button>
    </>
  );
};
export default App;

在上面的代码中，我必须同时单击两次才能显示文本，单击一次才能隐藏文本。如果您知道解决方案，请分享您的宝贵建议。

【问题讨论】：

标签： reactjs react-native react-hooks react-redux frontend

【解决方案1】：

import React, { useState } from "react";

const App = () => {
  const [open, setOpen] = useState(false);
  const handleOpen = () => {
    setOpen(!open);
  };
  return (
    <>
      {open && <div> I am visible </div>}
      <button onClick={handleOpen}> change visibility </button>
    </>
  );
};
export default App;

https://codesandbox.io/s/recursing-jerry-ig46ct?file=/src/App.js:0-318

【讨论】：