Search code examples
javascriptreact-nativereact-native-router-flux

Does `react-native-router-flux` allow for parent components which render children?


I might have missed something in the docs here.

Does react-native-router-flux allow for a parent scene with a component, which would render the child scenes through it?

In code speak, for this routing:

<Scene key="home" component={ApplicationRoot}>
  <Scene key="settings" component={Settings} />
</Scene>

the ApplicationRoot component would

class ApplicationRoot extends React.Component {
   constructor() { .. }
   render() {
     return(
       <View>{this.props.children}</View>
     );
   }
}

passing Settings through here.

The idea being I can have lifecycle functions within ApplicationRoot to handle app-level functionality (like checking if logged in, listening for log outs etc), that would apply to all nested routes.

If this isn't possible via a wrapping parent component, does anyone know of a way to achieve this?


Solution

  • Following the example in the official code base, I've gone for the switcher solution; a root initial component (always set to initial={true}) which will in turn be responsible for checking (in my case) Redux state and routing to the relevant pages.

    Doesn't do exactly what I was after, as it won't be able to listen to state at an application level, but it does the job.