Problem with my navigator in a class component - react-native

Question

everyone,
I'm want to create a button which redirects to another view but it doesn't work. All my views are defined in homeStack.js:
const screens= {
LoginPage: {
screen: Login,
navigationOptions: {
headerShown: false
},
},
RegisterPage: {
screen: Register,
navigationOptions: {
headerShown: false
},
},
DetailsPage: {
screen: Details,
navigationOptions: {
headerShown: false
},
},
}
const HomeStack = createStackNavigator(screens);
export default createAppContainer(HomeStack);
Now I have a login class component containing different functions including:
renderLoginform(){
return (
<View style={{ flex: 1, backgroundColor: '#FC8686', justifyContent: 'center' }}>
<View style={{flex: 6, backgroundColor: 'white', borderBottomLeftRadius: 30, borderBottomRightRadius: 30, }}>
<SafeAreaView style={{alignItems: 'center', flex: 1, alignItems: 'center'}}>
<Text style={{fontSize: 40, flex: 1}}>Sign In</Text>
<View style={style.formContainerStyle}>
<View style={style.fieldStyle}>
<TextInput
placeholder="username"
autoCorrect={false}
autoCapitalize="none"
onChangeText={this.onUsernameChange.bind(this)}
style={style.textInputStyle}
textAlign={'center'}
/>
</View>
<View style={style.fieldStyle}>
<TextInput
secureTextEntry
autoCapitalize="none"
autoCorrect={false}
placeholder="password"
onChangeText={this.onPasswordChange.bind(this)}
style={style.textInputStyle}
textAlign={'center'}
/>
</View>
</View>
<View style={style.buttonzone}>
<View style={style.buttonContainerStyle}>
{this.renderButton()}
</View>
<View style={style.buttonContainerStyle}>
</View>
**<Button
title='Go to Register'
onPress={this.props.navigation.navigate('RegisterPage')}></Button>**
</View>
</SafeAreaView>
</View>
</View>
);
}
The last element of the code is a button whose click should link to my RegisterPage. But it won't work. What's wrong ?
This function is then called in the render return of the Login class.
Thanks for your help.

Answer 1

Try using this way
onPress={() => this.props.navigation.navigate('RegisterPage')}