react-navigation / redux-helpers

Redux middleware and utils for React Navigation
Other
296 stars 43 forks source link

react native android hardware back button #48

Closed whyaftab closed 6 years ago

whyaftab commented 6 years ago

hello everyone i am new in react-native and stuck at android hardware back button integration in https://reactnavigation.org/docs/en/redux-integration.html#handling-the-hardware-back-button-in-android i am getting error of undefined is not an object (evaluating 'state.routes') below is my code

` const AppStack = createStackNavigator({ mainScreen: { screen: MainScreen, navigationOptions: ({ navigation }) => ({ header: }) }, userProfile: { screen: UserProfile, navigationOptions: ({ navigation }) => ({ headerTitle: 'Profile', headerTitleStyle: { flex: 1, textAlign: 'center', alignSelf: 'center' }, headerRight: (<View style={{ paddingRight: 15 }} > <Icon onPress={() => navigation.navigate('EditUserProfile')} name="edit" /> ) }) }, editUserProfile: { screen: EditUserProfile,

navigationOptions: ({ navigation }) => ({
  headerTitle: 'Edit Profile',
  headerTitleStyle: {
  flex: 1,
  textAlign: 'center',
  alignSelf: 'center'
 },
  headerRight: (<View style={{ paddingRight: 15 }} >
                  <Icon onPress={() => navigation.navigate('logout')} name="exit-to-app" />
                </View>)
})

}, PrivateChat: { screen: PrivateChat, } }, logout: { screen: Logout } }, { initialRouteName: 'mainScreen', });

const AuthStack = createStackNavigator({ auth: { screen: Form, navigationOptions: { header: null } } });

const SwitchNavigator = createSwitchNavigator( { AuthLoading: AuthLoadingScreen, App: AppStack, Auth: AuthStack }, { initialRouteName: 'AuthLoading', } );

export const MainNavigation = createDrawerNavigator({ Home: { screen: SwitchNavigator } }, { contentComponent: (props) => ( <DrawerNavigation {...props} /> ) });

// Create middleware and connect export const appNavigatorMiddleware = createReactNavigationReduxMiddleware( 'root', state => state.nav );

const ReduxAppNavigator = reduxifyNavigator(MainNavigation, 'root');

// create nav component class ReduxNavigation extends PureComponent { componentDidMount() { BackHandler.addEventListener('hardwareBackPress', this.onBackPress); }

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

onBackPress = () => { const { dispatch, state } = this.props; if (state.index === 0) { return false; }

dispatch(NavigationActions.back());
return true;

};

render() { const { dispatch, state } = this.props; console.log(this.props); return ; } }

const mapStateToProps = state => { console.log(state.nav); return { state: state.nav }; }; `

export default connect(mapStateToProps)(ReduxNavigation);

after some changes navigation is working but back button still closing the app and maybe the reason is that state.index is not changing it value it is 0 on every screen i am opening maybe because of switchnavigation

"react-navigation": "^2.5.1", "react-navigation-redux-helpers": "^2.0.0-beta.1"

Ashoat commented 6 years ago

See #44

whyaftab commented 6 years ago

after removing if (state.index === 0) { return false; } its working