Greetings, I'm a newcomer to the world of react native and currently facing an issue:
const Tab = createMaterialTopTabNavigator();
export const CurriculumMenu = ({navigation, item}) => {
const data = item.Title;
console.log(data)
return (
<StyledCurriculumNavigator initialRouteName="Overview" navigation={navigation} item={item}>
<Tab.Screen name="Overview" initialParams={{data:data}} component={Overview} />
<Tab.Screen name="Curriculum" initialParams={{data:data}} component={Curriculum} />
<Tab.Screen name="Teachers" initialParams={{data:data}} component={Teachers} />
</StyledCurriculumNavigator>
);
}
This is a nested navigator where I am attempting to pass parameters to the screens within it.
export const Teachers = ({data}) => {
console.log(data)
return(
<View>
< TeacherModule />
< TeacherModule />
< TeacherModule />
</View>
)
};
(I realize that I should be using a FlatList, which I will implement once this issue is resolved)
When I log the data in my main navigator, it returns the correct data, however in the Teachers module it returns 'undefined'.
What am I missing? Apologies for my lack of experience.