How to pass navigator reference to nested child components?

Question

I want to make navigation drawer list item clickable, in that scenario i want navigator object to navigate another scene. How can i pass navigator reference there from main component to child component? My child components of Main components are ListView and ListItems. Any suggestion will be helpful.

Answer 1

You are able to pass it down just like any other prop. I'm assuming you're passing navigator down to the routed component...

<Navigator
  ref='Navigator'
  renderScene={(route, navigator) => {
             let RoutedComponent = route.component
             return (
               <RoutedComponent navigator={navigator} {...route.props}/>
             )
  }}
/>

If so, in the RoutedComponent just pass the navigator down to it's child components through props.

<MyChildComponent navigator={this.props.navigator}/>