React Navigation StackNavigator no aparece cuando se usa dentro de otra vista
Estoy intentando usar un StackNavigator de React Navigation para un proceso que incluye un componente estático en la parte superior de la página y componentes variables en la parte inferior. El código que estoy usando es:
const Navigator = StackNavigator ({
splash: Splash,
prompt: Prompt,
pinCheck: PinCheck
}, {
initialRouteName: 'splash'
});
export default class Login extends React.Component
{
constructor (props)
{
super (props);
// code to set up animation state
}
componentDidMount()
{
// code to set up animation
}
finish_ (state)
{
this.props.navigation.navigate ('main', state);
}
render()
{
const screen = Dimensions.get('screen');
return (
<KeyboardAvoidingView style={Global.styles.verticalFill} ref={this.saveContainerRef}>
<ScrollView style={{flex: 1}} contentContainerStyle={{justifyContent: 'space-between'}}>
<Animated.View style={{opacity:this.state.fade1,alignItems:'center'}} >
<Image
style={{width:screen.width * 0.6,height: screen.height*0.55}}
source={imgLogo}
resizeMode='contain'
/>
<Navigator />
</Animated.View>
</ScrollView>
</KeyboardAvoidingView>
);
}
}
Cuando ejecuto esto, sin embargo, no se muestra mi componente de ruta inicial. Sin embargo, funciona correctamente si cambio <Navigator/>
por <Splash/>
, por lo que el componente definitivamente funciona en este contexto.
¿Alguna idea de lo que está mal?
Mostrar la mejor respuesta