CODEWITHSUNDEEP
javascriptreact-nativereact-navigation
Yohanes AI
Yohanes AI

Reputation: 3621

react-navigation goBack doesn't works

I have 2 screen here. First LoginScreen and LoginFormScreen. Let say, LoginScreen have a button, LoginButton : Navigate to LoginFormScreen. The activity flow should be

LoginScreen.js -> LoginFormScreen.js

So here my AppNavigator.js

import LoginScreen from '../screens/LoginScreen';
import LoginFormScreen from '../screens/LoginFormScreen'

export default createAppContainer(createSwitchNavigator({ 
    Login: {screen : LoginScreen},
    LoginForm: {screen: LoginFormScreen},
}, {
  initialRouteName: 'Login',
}));

On my LoginScreen button, here action that handled onPress

<Button
   title="Log In"
   titleStyle={{ fontWeight: 'bold', fontSize: 18 }}
   onPress={() => this.props.navigation.navigate('LoginForm')}

And on my LoginFormScreen, I want to once user click back physical button then return to previous screen (LoginScreen). Here are my code

constructor(props) {
    super(props); 
    this.handleBackButtonClick = this.handleBackButtonClick.bind(this);
  }

  componentWillMount() {
      BackHandler.addEventListener('hardwareBackPress', this.handleBackButtonClick);
  }

  componentWillUnmount() {
      BackHandler.removeEventListener('hardwareBackPress', this.handleBackButtonClick);
  }

  handleBackButtonClick() {
    this.props.navigation.dispatch(NavigationActions.back());
    this.props.navigation.goBack("Login")
    this.props.navigation.goBack(null)
    this.props.navigation.goBack()
    return true;
  }

Have tried all those code above and nothing works with me. Have check other solution on Stackoverflow and GitHub including react-navigation homepage but no the solution works.

Have try goBack(), goBack(null), dispatch(NavigationActions.back()) and no one works.

Please someone help me out from this problem.

Upvotes: 0

Views: 272

Answers (1)

warl0ck
warl0ck

Reputation: 3464

As you are using createSwitchNavigator instead of createStackNavigator where you can push and pop the screens and in createSwitchNavigator as the doc says there will only be a single screen visible at a time i.e. no stack will be present you can do

this.props.navigation.navigate('Login')

Upvotes: 1

Related Questions