expo / ex-navigation

Route-centric navigation for React Native
997 stars 201 forks source link

Store.dispatch throwing "Cannot read property 'push' of undefined #334

Open mars76 opened 7 years ago

mars76 commented 7 years ago

Hi,

I have implemented my own Tab Navigation and on clicking each Tab i am using Store's dispatch method

How ever i am getting the Error " Cannot read property 'push' of undefined . It's coming from ExNavigationMiddleware.js (63) where it is checking for action type. I am not sure why the action is undefined.

From my Container Component i am calling my action creator.

<TouchableOpacity style={{ flexDirection: 'row' }} onPress={this.props.goToHome}>
                        <FontAwesomeIcon 
                                size={20} 
                                name="home" 
                                color={this.getIconColor(0)} 
                                onPress={this.props.goToHome} 
                        />
                        <Text style={[styles.tabTitleText, this.props.selectedTabIndex === 0 ? { color: '#000' } : { color: '#FFF' }]}>Home</Text>
                    </TouchableOpacity>

and my actionCreator has the following code

export function goToHome() {
    goToScreen('home');
}

function goToScreen(screenName) {
    console.log('.goToScreen() : screenName =[' + screenName + ']');
    const navigatorUID = Store.getState().navigation.currentNavigatorUID;
    const route = Router.getRoute(screenName);
    console.log(route);
    Store.dispatch(NavigationActions.push(navigatorUID, route));
}

The route i am trying to navigate to is defined in my router configuration.

When i tried to debug the final action that i am getting in ExNavigationMiddleware is undefined and the actionType is "EX_NAVIGATION.GO_BACK". I am not sure why the action object is undefined.

I have a component for rendering the Navigation Tabs at the top and i am passing visible: false in my StackNavigation default configuration.

        ```
<StackNavigation 
                    initialRoute={Router.getRoute('login')}

                    defaultRouteConfig={{
                        styles: {
                            ...NavigationStyles.SlideVertical,
                        },
                        navigationBar: {
                            visible: false,
                        },
                    }} 
                />


Not sure what i am doing wrong..
mars76 commented 7 years ago

When i moved my action creator method from Action to the component it is working as expected.