Question

isTrue 没有变为 true 的原因是什么？如您所见，我将它设置在 useEffect 中。这里到底发生了什么？

import React, {useState, useEffect} from "react";
import "./style.css";

export default function App() {
  const [isTrue, setIsTrue] = useState(false)

  useEffect(() => {
    setIsTrue(true)
    console.log(isTrue) //still gives me false
  }, [])

  return (
    <div>
      <h1>Hello StackBlitz!</h1>
      <p>Start editing to see some magic happen :)</p>
    </div>
  );
}

Answer 1

您在 isTrue === false 值上有一个 closure，您可以有另一个 useEffect 来监听它的变化：

export default function App() {
  const [isTrue, setIsTrue] = useState(false);

  useEffect(() => {
    setIsTrue(true);
  }, []);

  useEffect(() => {
    console.log(isTrue);
  }, [isTrue]);

  return (
    <div>
      <h1>Hello StackBlitz!</h1>
      <p>Start editing to see some magic happen :)</p>
    </div>
  );
}

为什么 setState 不会改变 useEffect 内部的状态？

1 个答案: