您的位置:首页 > Web前端 > React

React-Native Android物理返回键

2017-03-08 10:01 525 查看
项目中真实运用到的

/**
* Created by tulin1 on 2017/2/7.
*/

import React, {Component} from 'react';
import {
View,
BackAndroid,
ToastAndroid
} from 'react-native';

import Main from '../Main/Main';
import NavbarComp from '../Navigator/navigator'

export default class IndexView extends Component {
//注册Android环境物理返回监听事件
componentWillMount(){
BackAndroid.addEventListener('hardwareBackPress', this.onBackAndroid);
}

//解绑Android环境物理返回监听事件
componentWillUnmount() {
BackAndroid.removeEventListener('hardwareBackPress', this.onBackAndroid);
}

//Android物理返回键处理
onBackAndroid = () => {
const routers = this.props.navigator.getCurrentRoutes();
// 当前页面不为root页面时的处理
if (routers.length > 1) {
const top = routers[routers.length - 1];
if (top.ignoreBack || top.component.ignoreBack) {
// 路由或组件上决定这个界面忽略back键
return true;
}
const handleBack = top.handleBack || top.component.handleBack;
if (handleBack) {
// 路由或组件上决定这个界面自行处理back键
return handleBack();
}
// 默认行为: 退出当前界面。
navigator.pop();
return true;
}

if (this.lastBackPressed && this.lastBackPressed + 2000 >= Date.now()) {
//最近2秒内按过back键,可以退出应用。
return false;
}
this.lastBackPressed = Date.now();
ToastAndroid.show('再按一次退出应用', ToastAndroid.SHORT);
return true;
};
render() {

return (
<View style={{flexGrow: 1}}>
<Main navigator={this.props.navigator}/>
</View>

);

}

}

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: