我剛剛開始學習本機反應，我正在嘗試創建一個使用 NativeBase ActionSheet 組件的登錄螢屏，但我不斷收到錯誤訊息React has detected a change in the order of Hooks called
我相信這是由于fontsLoaded布林值是異步加載的，但我不確定。處理異步方法并確保正確加載螢屏的正確方法是什么？
這是我的代碼：
function LoginScreen() {
let [fontsLoaded] = useFonts({
HammersmithOne_400Regular,
})
if (!fontsLoaded) {
return <AppLoading />;
}
const {
isOpen,
onOpen,
onClose
} = useDisclose();
return (
<View style={styles.container}>
<Text style={styles.logo}>Logo</Text>
<View style={styles.signInContainer}>
<Button onPress={onOpen} title="Log in">
Log in
</Button>
<Actionsheet isOpen={isOpen} onClose={onClose}>
<Actionsheet.Content>
<Box w="100%" h={60} px={4} justifyContent="center">
<Text>
Albums
</Text>
</Box>
</Actionsheet.Content>
</Actionsheet>
</View>
</View>
);
}
uj5u.com熱心網友回復：
好吧，您違反了鉤子規則，因為您在 if (!fontsLoaded) { return ; 之后有條件地呼叫 useDisclose }
鉤子必須在組件的頂層呼叫。
在這里，您可以找到有關 react docs 中所有鉤子規則的更多資訊： https ://reactjs.org/docs/hooks-rules.html
為了解決您的問題，您必須在 if 陳述句之前呼叫 useDisclose。
uj5u.com熱心網友回復：
將 useDisclose 鉤子移到頂部和下面的 if 陳述句。這就是為什么
let [fontsLoaded] = useFonts({
HammersmithOne_400Regular,
})
const {
isOpen,
onOpen,
onClose
} = useDisclose();
if (!fontsLoaded) {
return <AppLoading />;
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/451752.html
上一篇：可以在多執行緒環境中使用JerseyClient來使用restapi嗎？
下一篇：關于Alpine.js中的異步