ReactNative封装自定义导航组件

封装导航后，通过 Router 管理所有页面。

格式：router.toXXX(params);

    import React , {Component} from 'react';
    import { StyleSheet, PropTypes, View, Navigator} from 'react-native';
    import BackPress from './BackPress';
    import Router from './Router';

    export default class Navigation extends Component { 
              componentDidMount() { 
                  //安卓返回键事件监听 
                  this.backPress = new BackPress(this.navigation); 
              }
              componentWillUnmount() { 
                  //解除安卓返回键监听事件 
                  this.backPress.removeListener(); 
              }  
              /** * 路由转跳的效果，默认是FadeAndroid */
               configureScene(route, routeStact) { 
                  //如果路由有传 切换方式，则使用 
                    if (route.configureScene) { 
                          return route.configureScene;
                    } else { 
                          return Navigator.SceneConfigs.FadeAndroid;
                    } 
                 }
                 /** * 渲染视图，传递props */ 
                renderScene(route, navigator) {
                     //router是传递给其他组件，用于路由跳转的类 
                    this.router = this.router || new Router(navigator); 
                    //把actions直接传递给每个通过路由转跳的页面，其他参数则通过 route.params传递，它可覆盖actions 
                    this.actions = this.actions || route.params.actions;
                     if (route.component) {
                           const MyComponent = route.component; 
                           return ( 
                                <MyComponent router={this.router} actions={this.actions} {...route.params} /> ) 
                          } 
                     }  
                     render() { 
                          const {initialRoute} = this.props; 
                          return ( 
                                <Navigator 
                                      ref={view => this.navigation = view} 
                                      initialRoute={initialRoute} 
                                      navigationBar={
                                            <View></View>
                                      } 
                                     configureScene={this.configureScene.bind(this)} 
                                     renderScene={this.renderScene.bind(this)} 
                                 /> 
                          )
                   }
           }
           Navigator.propTypes = { 
                  initialRoute: PropTypes.object.isRequired
          }