React Native学习之导航器Navigator的使用(三

1、导航器用于页面之间的切换，根据文档介绍，从0.44版本开始，Navigator被从react native的核心组件库中剥离到了一个名为react-native-deprecated-custom-components的单独模块中。如果你需要继续使用Navigator，则需要先yarn add react-native-deprecated-custom-components安装，然后从这个模块中import，即import { Navigator } from 'react-native-deprecated-custom-components'.
2、具体使用方法可以看http://bbs.reactnative.cn/topic/20/%E6%96%B0%E6%89%8B%E7%90%86%E8%A7%A3navigator%E7%9A%84%E6%95%99%E7%A8%8B/2，里面包含了页面的跳转以及传参；
3、补充一点，针对android app开发中经常会在第一个页面双击两下退出应用，这个可以放程序的入口处，避免每个页面都写；

import React, {Component} from 'react';
import {
    Platform,
    BackAndroid,
    ToastAndroid,
} from 'react-native';
import {Navigator} from 'react-native-deprecated-custom-components'
import Splash from './component/SplashComponent'
import hookNavigator from './utils/hookNavigator';

export default class App extends Component {

    render() {
        return (
            <Navigator
                ref={this.onNavigatorRef}
                initialRoute={{id: 'splash', component: Splash}}
                configureScene={this.configureScene}
                renderScene={this.renderScene}
            />
        );
    }
  //这里需要把navigator的引用设置为全局变量，后面需要使用到该引用
    onNavigatorRef = (ref) => {
        this.navigator = ref;
        if (ref) {
            hookNavigator(ref);
        }
    };
    configureScene(route) {
        // if (route.sceneConfig) { // 有设置场景
        //     return route.sceneConfig;
        // }
        return Navigator.SceneConfigs.PushFromRight; // 默认，右侧弹出
    }

    renderScene(route, navigator) {
        return <route.component {...route.passProps} nav={navigator}/>;
    }

    componentDidMount() {
        if (Platform.OS === 'android') {
            BackAndroid.addEventListener('hardwareBackPress', this.onBackAndroid);
        }
    }

    componentWillUnmount() {
        if (Platform.OS === 'android') {
            BackAndroid.removeEventListener('hardwareBackPress', this.onBackAndroid);
        }
    }

    onBackAndroid = () => {
        let nav = this.navigator;
        const routers = nav.getCurrentRoutes();
        if (routers.length > 1) {
            nav.pop();
            return true;
        }
        let now = new Date().getTime();
        if (now - this.lastClickTime < 2500) {
            //2.5秒内点击后退键两次推出应用程序
            return false;//控制权交给原生
        }
        this.lastClickTime = now;
        ToastAndroid.show('再按一次退出应用', ToastAndroid.SHORT);
        return true;
    };
}