Navigate to nested screen react native

Question

I have a bottom tab navigator like so:

const Tab = BottomTabNavigator()

const BottomTab = () => (

  <Tab.Navigator>
    <Tab.Screen name = "Feed" component = {FeedNavigator}/>
    <Tab.Screen name = "Profile" component = {Profile}/>
  <Tab.Navigator>
)

The feed component is a Stack navigator like so:

const FeedNavigator = () => {
  return (
    <Stack.Navigator> 
      <Stack.Screen name = "Food" component = {Food}/>
      <Stack.Screen name = "MainFeed" component = {MainFeed}/>
    </Stack.Navigator>
  )
}

how do i navigate from my Profile screen to the Food component inside the FeedNavigator and pass props to it

Answer 1

navigation.navigate('Feed', { screen: 'Food', params: { user: 'jane'}, });