我收到错误"Effect callbacks are synchronous to prevent race conditions. Put the async function inside"

Question

react应用程序没有显示任何内容，我无法解决这个错误。请帮我把它处理掉。

function Homescreen() {
const [rooms, setrooms] = useState([])
const[loading, setloading] = useState()
const[error, seterror] = useState()
useEffect(async() => {
try {
setloading(true)
const data = (await axios.get('/api/rooms/getallrooms')).data
setrooms(data)
setloading(false)
} catch (error) {
seterror(true)
console.log(error)
setloading(false)
}
}, [])

Answer 1

useEffect不期望返回承诺。警告消息告诉您这样做:

useEffect(() => {
const load = async () => {
try {
setloading(true);
const data = (await axios.get("/api/rooms/getallrooms")).data;
setrooms(data);
setloading(false);
} catch (error) {
seterror(true);
console.log(error);
setloading(false);
}
};
load();
}, []);

然而，如果你的应用程序不显示任何东西，我不确定这会解决这个问题。你可能还有别的问题。