StrictMode在useEffect内中断useState. 在没有StrictMode或构建的情况下,代码运行良好.
SetIsLoding应在useEffect中将状态设置为False. SetIsLoding(FALSE)"可以解决这个问题",但它不能解释为什么setIsLoding(PremState=>;!PremState)会将其设置回TRUE.这仅仅是因为StrictModes双重呈现而发生的吗?或者,有没有更好的方法来做到这一点?
import { useEffect, useState } from "react";
export default function App() {
const [isLoading, setIsLoading] = useState<boolean>(true);
useEffect(() => {
const getData = async () => {
/*
Some random code would be here
*/
setIsLoading((prevState) => !prevState);
};
getData();
}, []);
return (
<div className="App">
{isLoading ? <div>Loading...</div> : <div>Data has been loaded</div>}
</div>
);
}
这里有一个链接到一个codesandbox,如果你想try 一下. https://codesandbox.io/p/sandbox/bug-test-39l53k?file=%2Fsrc%2FApp.tsx