转自东方耀的学习视频
下面的这个例子实现了双击退出和类似于引导页的在第二页退出。
首先为BackAndroid设置监听器:
componentWillMount() {
BackAndroid.addEventListener('listener',this.onBackPressed);
}
componentWillUnMount() {
BackAndroid.removeEventListener('listener',this.onBackPressed);
}
与主组件的生命周期绑定起来,第一个参数唯一标识一个监听器,第二个是自定义的监听方法
监听方法:
onBackPressed=()=>{
navigator=this.refs.navigator;
routes=navigator.getCurrentRoutes();
if(routes.length>2){
navigator.pop();
return true;
} else{
//到了主页了
if (this.lastBackPressed && this.lastBackPressed + 2000 >= Date.now()) {
//最近2秒内按过back键,可以退出应用。
return false;
}
this.lastBackPressed = Date.now();
ToastAndroid.show('再按一次退出应用', ToastAndroid.SHORT);
return true;
}
}
我们知道,Back键主要管理页面栈的出栈操作,所以肯定要和navigator联系起来。这里要获取主组件的navigator实例,使用的方法是为navagator添加一个ref属性,值是一个唯一指定的字符串id:
<Navigator style={{flex:1}}
initialRoute={{component:FirstPage}}
configureScene={this.configureScene}
renderScene={this.renderScene}
ref="navigator">
</Navigator>
然后在使用的时候通过this.refs.navigator就可以了。
首先了解下返回值的含义,返回true说明接管点击操作,不需要系统进一步操作。返回false则由系统接管,直接退出应用。
获取到navigator后,再通过getCurrentRoutes获取当前的页面栈。然后通过length对栈中的组件数进行判断,这里判断在组件有两个以上时执行正常的出栈操作,在两个的时候(也就是引导页的下一页,一般是主页面)设置一个两秒的两个点击间隔判断,也就是双击退出。这里还用到了ToastAndroid,用法和安卓非常类似,比较简单。