react useState 更新的问题

Question

function App() {
  const ref = useRef(0);
  ref.current++;

  const [title, setTitle] = useState("hahaha");

  useEffect(() => {
    console.log('effect');
    setTitle("gggggg");
  });

  return (
    <div className="App">
      {console.log(ref.current)}
      {ref.current}
    </div>
  );
}

此段代码为何控制台中打印出了3，但浏览器中却显示2，想了半天没明白，望大佬解答！

Answer 1

变更 .current 属性不会引发组件重新渲染 这是 useRef 特性之一
推荐阅读 React-Hook 基础使用