使用 useEffect 同步修改浏览器 tab 栏中的标题

const App = (props) => {
  const [count, setCount] = useState(props.count);
  const [text, setText] = useState("");

  useEffect(() => {
    console.log("useEffect ran");
    // 修改 tab 的内容
    document.title = count;
  }, [count]);  // 依赖仅为 count，text 不需要，

  return (
    <div>
      <p>
        The current {text || "count"} is {count}
      </p>
      <button onClick={() => setCount(count - 1)}>-1</button>
      <button onClick={() => setCount(props.count)}>reset</button>
      <button onClick={() => setCount(count + 1)}>+1</button>
      <input value={text} onChange={(e) => setText(e.target.value)}></input>
    </div>
  );
};