Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

How to move data from screen to screen with nested navigation?

$
0
0

I know theres some questions about this already but none of them have helped. In my case I have a couple nested navigations which I think might be the problme. Im getting a "undefined is not an object (evaluating this.props.navigation.state.params)" error when trying to get my data. I have this const { navigate } = this.props.navigation; is my render and sending the data with navigate("AddressForm", {p1:this.state.address}). While I try to receive it with this.props.navigation.state.params.p1. From what I understood from the other one somehow my params for the navigation are undefined when they shouldnt. Below are my two navigations. Main Navigation:

const { Navigator, Screen } = createBottomTabNavigator();const PersonIcon = (props) => (<Icon {...props} name='person-outline'/>);const MapIcon = (props) => (<Icon {...props} name='map-outline'/>);const LeadsIcon = (props) => (<Icon {...props} name='clipboard-outline'/>);const SettingsIcon = (props) => (<Icon {...props} name='settings-outline'/>);const BottomTabBar = ({ navigation, state }) => (<BottomNavigation    selectedIndex={state.index}    onSelect={index => navigation.navigate(state.routeNames[index])}    style={styles.bottomNavigation}><BottomNavigationTab title='My Stats' icon={PersonIcon}/><BottomNavigationTab title='Map' icon={MapIcon} /><BottomNavigationTab title='My Leads' icon={LeadsIcon}/><BottomNavigationTab title='Settings' icon={SettingsIcon}/></BottomNavigation>);const TabNavigator = () => (<Navigator tabBar={props => <BottomTabBar {...props} />} ><Screen name='My Stats' component={StatScreenNav}/><Screen name='Map' component={MapNav} /><Screen name='My Leads' component={MyLeads}/><Screen name='Settings' component={Settings}/></Navigator>);

Second Navigation:

const Stack = createStackNavigator();const MapScreenNav = (props) => {  return (<Stack.Navigator screenOptions={{ headerShown: false }} ><Stack.Screen name="MapComponent" component={MapComponent} /><Stack.Screen name="AddressForm" component={AddressForm} /></Stack.Navigator>  );};export default MapScreenNav;

Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>