美文网首页
React-Native 学习之路 - Navigation指定

React-Native 学习之路 - Navigation指定

作者: NO我的错 | 来源:发表于2018-09-13 12:44 被阅读0次

在需要监听的页面,引入官网代码

import { BackHandler,ToastAndroid } from 'react-native';
export default class Index extends Component {
    _didFocusSubscription;
    _willBlurSubscription;
    constructor(props) {
        super(props);
        this._didFocusSubscription = props.navigation.addListener('didFocus', payload =>
            BackHandler.addEventListener('hardwareBackPress', this.onBackAndroid)
        );
    }
    componentDidMount() {
        this._willBlurSubscription = this.props.navigation.addListener('willBlur', payload =>
            BackHandler.removeEventListener('hardwareBackPress', this.onBackAndroid)
        );
    }
    componentWillUnmount() {
        this._didFocusSubscription && this._didFocusSubscription.remove();
        this._willBlurSubscription && this._willBlurSubscription.remove();
    }
    //触发返回键执行方法
    onBackAndroid = () => {
        if (this.lastBackPressed && this.lastBackPressed + 2000 >= Date.now()) {
            //最近2秒内按过back键,可以退出应用。
            BackHandler.exitApp();
            return;
        }
        this.lastBackPressed = Date.now();
        ToastAndroid.show('再按一次退出应用',ToastAndroid.SHORT);
        return true;
    };
}

相关文章

网友评论

      本文标题:React-Native 学习之路 - Navigation指定

      本文链接:https://www.haomeiwen.com/subject/vmdwgftx.html