我应该调用一个函数，该函数在setState之后立即返回promise，还是在useEffect()的依赖数组中返回pr

Question

我的代码(看起来工作正常(如下所示：

import { SplashScreen } from "@capacitor/splash-screen";
const MyComponent = () => {
const [data, setData] = useState()
useEffect(() => {
init()
}, [])
const init = async () => {
const response = await fetch("some_api")
setData(response.data)
await SplashScreen.hide()
} 
return (<div>{JSON.stringify(data)}<div>)
}

但我想知道，将await SplashScreen.hide()函数调用移动到useEffect((，并将依赖数组中的数据如下所示是否更好：

import { SplashScreen } from "@capacitor/splash-screen";
const MyComponent = () => {
const [data, setData] = useState()
useEffect(() => {
init()
}, [])
useEffect(() => {
if (data) {
await SplashScreen.hide()
}
}, [data])
const init = async () => {
const response = await fetch("some_api")
setData(response.data)
} 
return (<div>{JSON.stringify(data)}<div>)
}

注意：SplashScreen.hide((返回一个promise。哪种方式更好，为什么？

Answer 1

这取决于数据设置后是否要调用SplashScreen.hide()。在第一种情况下，由于setState是异步工作的，因此不能保证在设置数据后进行调用。不过，在第二种情况下，在状态更新后显式调用SplashScreen.hide()。

注意，由于您没有使用SplashScreen.hide()返回的promise执行任何操作，因此没有必要使用await调用它。