fix for #141, #127

ExRouter.js

@@ -24,10 +24,11 @@ export class ExRouteAdapter {
         }
         this.route = route;
         this.name = route.name;
+        this.title = props.title || route.title;
         if (!this.name){
             throw new Error("name is not defined for route");
         }
-        this.props = props;
+        this.props = props || {};
         this.renderScene = this.renderScene.bind(this);
         if (this.route.props.renderRightButton){
             this.renderRightButton = this.route.props.renderRightButton.bind(this.route);
@@ -45,15 +46,15 @@ export class ExRouteAdapter {
     }
 
     renderScene(navigator) {
-        debug("RENDER SCENE:"+ this.route.name + " TITLE:"+this.route.title+" NAVBAR"+this.route.props.hideNavBar+" IS COMPONENT:"+(this.route.component!=null)+" TYPE:"+this.route.type);
+        console.log("PROPS:"+this.props);
         const Component = this.route.component;
         const child = Component ?
             !this.route.wrapRouter ? <Component key={this.route.name} name={this.route.name} {...this.route.props} {...this.props} route={this.route}/>:
                 <ReactRouter name={this.route.name+"Router"} {...this.route.props} {...this.props} route={this.route} router={ExRouter}  initial={"_"+this.route.name} footer={null} header={null}>
                     <Components.Route {...this.route.props}  {...this.props} component={Component} name={"_"+this.route.name} type="push" wrapRouter={false} initial={true}/>
                 </ReactRouter>
             :
-            React.cloneElement(React.Children.only(this.route.children), {...this.route.props, data:this.props, route:this.route});
+            React.cloneElement(React.Children.only(this.route.children), {...this.route.props, ...this.props, route:this.route});
 
         const Header = this.route.header;
         const header = Header ? <Header {...this.route.props} {...this.props}/> : null;
@@ -76,14 +77,15 @@ export class ExRouteAdapter {
 
     getTitle() {
         debug("TITLE ="+this.route.title+" for route="+this.route.name);
-        return this.route.title || "";
+        return this.title || "";
     }
 
     getBackButtonTitle(navigator, index, state){
         let previousIndex = index - 1;
         let previousRoute = state.routeStack[previousIndex];
         let title = previousRoute.getTitle(navigator, previousIndex, state);
-        return title.length>10 ? null : title;
+        const res = title.length>10 ? null : title;
+        return this.route.props.leftTitle || res;
     }
 
     renderLeftButton(navigator, index, state){

Example/Example.js

@@ -38,7 +38,7 @@ export default class Example extends React.Component {
                 <Route name="home" component={Home} title="Replace" type="replace"/>
                 <Route name="login" schema="modal">
                     <Router name="loginRouter">
-                        <Route name="loginModal" component={Login} title="Login" schema="modal"/>
+                        <Route name="loginModal" component={Login} schema="modal"/>
                         <Route name="loginModal2" hideNavBar={true} component={Login2} title="Login2"/>
                     </Router>
                 </Route>

Example/package.json

@@ -8,6 +8,6 @@
   "dependencies": {
     "react-native": "^0.17",
     "react-native-button": "^1.2.1",
-    "react-native-router-flux": "^2.1.2"
+    "react-native-router-flux": "^2.1.3"
   }
 }

README.md

@@ -168,7 +168,6 @@ you might write:
 
 ## Limitations
 ### Nested Routers
-* Although you can pass data into a `Route` (e.g. `Actions.login({user_id: '3'})`), this is currently not working for `Route` inside of a nested `Router`.
 * If you are using a tab bar where each tab has its own `Router`, modal screens will have to be presented from the root navigator in order to cover the tab bar. To do this, the modal screen should be defined in the root router, and should have the `wrapRouter={true}` property as in the example below.
 ```
         <Router>

Router.js

@@ -109,21 +109,21 @@ export default class Router {
         this.schemas[name] = props;
     }
 
-    _addRoute(name: string, props:{ [key: string]: any}){
-        if (!name){
+    _addRoute(routeName: string, props:{ [key: string]: any}){
+        if (!routeName){
             throw new Error("Route name is not defined");
         }
         const schemaName: string = props.schema || 'default';
         const schema = this.schemas[schemaName] || {};
         // pass router data to inner routes
-        const {children, data, ...routerProps}  = this.props;
-        const routeProps = Object.assign({}, data, schema, props);
+        const {children, name, header, footer, showNavigationBar, route, component, hideNavBar, sceneConfig, type, ...routerProps}  = this.props;
+        const routeProps = Object.assign({}, schema, routerProps, props);
 
-        if (this.routes[name]){
-            throw new Error("Route="+name+" is not unique!");
+        if (this.routes[routeName]){
+            throw new Error("Route="+routeName+" is not unique!");
         }
 
-        this.routes[name] = new Route(routeProps, this);
+        this.routes[routeName] = new Route(routeProps, this);
 
     }
 
@@ -137,8 +137,6 @@ export default class Router {
                 Actions[name] = function(data){
                     return Actions.route(name, data);
                 }
-            } else {
-                throw new Error("Action = "+name+" is not unique!");
             }
         });
     }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-router-flux",
-  "version": "2.1.2",
+  "version": "2.1.3",
   "description": "React Native Router using Flux architecture",
   "main": "index.js",
   "scripts": {