Dynamic scenes

Some apps, like the one we've been working on in this chapter, have very similar scenes. In fact, they're so similar that having three unique components for this purpose feels awkward and repetitive. It would make more sense to have a single scene and navigation bar and pass them the dynamic pieces of information through the route objects.

Let's make some changes to the application, starting with the main module so that we don't need duplicate components anymore:

import React from 'react'; 
import { 
  AppRegistry, 
  Navigator, 
} from 'react-native'; 
 
import routes from './routes'; 
import styles from './styles'; 
 
// The scene content now comes from the "route". 
const renderScene = route => ( 
  <route.Scene 
    content={route.content} 
  /> 
); 
 
// The "routeMapper" object now has to pass each navbar item 
// more properties since the same component is used now. For 
// example...