react-navigation / redux-helpers

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

Error: Navigator has both navigation and container props #43

Closed trev91 closed 6 years ago

trev91 commented 6 years ago

I've started a new app that's pretty barebones. I've started it with Expo and Redux. Since the new updates to the API I've encountered this error: image

I've looked at the updated documentation and cannot figure out what's going on here. Anyone else encounter this error?

Here's my code for reference:

import React from 'react';
import { addNavigationHelpers, createStackNavigator } from 'react-navigation';
import { withNetworkConnectivity } from 'react-native-offline';
import { createStore, combineReducers } from 'redux';
import { createReactNavigationReduxMiddleware, reduxifyNavigator } from 'react-navigation-redux-helpers';
import { connect } from 'react-redux';
import { colors } from './../utils/BaseStyles';
import MainPage from './../screens/MainPage';

export const AppNavigator = createStackNavigator({
    Main: { screen: MainPage },
  }, 
  {
    initialRouteName: 'Main',
    navigationOptions: ({ navigation }) => {
      return {
        headerStyle: {
          backgroundColor: colors.primary,
        },
        headerTintColor: colors.primary_white,
        headerTitleStyle: {          
          color: colors.primary_white,
          fontSize: 21
        },
        headerBackTitleStyle: {
          fontSize: 16
        },
      }
    }
  });

const middleware = createReactNavigationReduxMiddleware(
  "App",
  state => state.nav,
);

let App = reduxifyNavigator(AppNavigator, "App")

// same error occurs if I use the withNetworkConnectivity or not. If I'm not using it, I rename App on the line above to AppWIthNavigationState

const AppWithNavigationState = withNetworkConnectivity({
  withRedux: true,
  pingServerUrl: 'https://www.google.com'
})(App)

const mapStateToProps = state => ({
  nav: state.nav,
  network: state.network.isConnected,
});

export default connect(mapStateToProps)(AppWithNavigationState);
Ashoat commented 6 years ago

The error seems pretty clear. You need to stop passing those props through. This is happening because of the way you are using withNetworkConnectivity. You also don't seem to be specifying a state param to the reduxified navigator, which is required.