react native 点击返回按钮退出应用

最新推荐文章于 2022-01-13 19:52:09 发布

reg183

最新推荐文章于 2022-01-13 19:52:09 发布

阅读量670

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/chendongpu/article/details/118695634

版权

前端专栏收录该内容

255 篇文章 3 订阅

订阅专栏

在这里插入图片描述
添加依赖

    "react-native-gesture-handler": "^1.10.3",
    "react-navigation": "^4.4.4",

添加代码

import React, { Component } from "react";
import {Text,BackHandler, View, Alert} from 'react-native';
import { NavigationActions } from 'react-navigation';

export default class App extends Component {

    componentDidMount() {
        BackHandler.addEventListener("hardwareBackPress", this.onBackPress);
    }

    componentWillUnmount() {
        BackHandler.removeEventListener("hardwareBackPress", this.onBackPress);
    }

    onBackPress = () => {
            Alert.alert(
                '退出应用',
                '确认退出应用吗?',
                [
                    { text: '取消', onPress: () => console.log('Cancel Pressed'), style: 'cancel' },
                    { text: '确认', onPress: () => BackHandler.exitApp() },
                ],
                { cancelable: false }
            );
            return true;
    };

    render() {
        return (
            <View>
                <Text>
                    Hello,world
                </Text>
            </View>
        )
    }
}