出于某种原因,我可以看到元素时,运行在网络上(使用博览会),他们呈现完美,当我点击“运行在网络浏览器”。
然而,当我尝试在iOS或Android上执行此操作时,它只显示一个空白屏幕,并且只显示LinearGradient。
当我运行Android Emulator并将其与React Native Dev工具结合时,我可以看到devtool中的元素,但它们不会显示在模拟器中。我尝试呈现的组件名为Login.tsx,如果我将Login.tsx中的所有内容复制到我的App.tsx中,它将在Web,Android和iOS上完美呈现。
我做错了什么?
const Stack = createNativeStackNavigator();
const Navigation: React.FC = () => {
return (
<NavigationContainer>
<Stack.Navigator
initialRouteName="Login"
>
<Stack.Screen
name="Login"
component={Login}
/>
<Stack.Screen
name="LostPassword"
component={LostPassword}
/>
<Stack.Screen
name="Register"
component={Register}
/>
</Stack.Navigator>
</NavigationContainer>)
}
export default Navigation;
const App: React.FC = () => {
return (
<LinearGradient
colors={["#2D1C96", '#190E60']}
style={styles.linearGradient}
>
<View style={styles.container}>
<Navigation />
<Toast ref={(ref) => Toast.setRef(ref)} />
</View>
</LinearGradient>
);
}
2条答案
按热度按时间0yycz8jy1#
解决了
面对同样问题的人:
NavigationContainer不应位于View内部。它应该被用作根组件
gcxthw6b2#
这个问题是很久以前提出的,但我有一个类似的问题,我的导航器在iOS上工作,但在Android上不工作。对我来说,有效的方法是删除任何 Package
NavigationContainer
的View
,并保留NavigationContainer
作为根组件。在这个问题的情况下,我认为应该将**
App
**中的LinearGradient
和View
作为 Package 器添加到导航器屏幕组件中,而不是用它们 Package 整个导航器。