如何根据同一周期的状态有条件地运行 useEffect

Kev*_*vvv 2 asynchronous race-condition reactjs react-native react-hooks

我有一系列事件,其中一个事件必须依赖于前一个事件的执行而发生。

const [token, setToken] = useState('')
const getToken = async () => {
    try {
        const newToken = await AsyncStorage.getItem(LOGIN_TOKEN)
        setToken(newToken)
    } catch (err) {
        throw new Error(err)
    }
}

useEffect(() => {
    getToken()
    if(token) {
        console.log("the final event")
    }
}, [postAction])
Run Code Online (Sandbox Code Playgroud)

我有useEffect每次postAction更改时都会运行的钩子。我希望“最终事件”仅在getToken运行并检索token. 我相信 setter 的异步性质setToken没有及时发生来token设置 以满足 的条件if statement。因此,最终事件永远不会在第一次运行时执行。

Nic*_*ick 5

您可以添加另一个useEffect专门查找令牌更改的挂钩。

useEffect(() => {
  getToken();
}, [postAction]);

useEffect(() => {
  if(token) {
    console.log("the final event")
  }
}, [token]);
Run Code Online (Sandbox Code Playgroud)