android - 防止 React Native 的硬件后退按钮 android

Question

我想阻止用户返回上一个屏幕。所以我添加了代码，但这不起作用。有什么解决方案吗？看到弹出警报，但“return false”不起作用。

componentDidMount() {
   BackAndroid.addEventListener('hardwareBackPress', () => {
     Alert.alert("alert","alert")

      this.props.navigator.pop();

       return false;
   });

Answer 1

如果你想禁用默认的后退按钮行为，你需要return true。

这是一个示例组件，它将阻止用户返回上一个屏幕。

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

class BackButtonDemo extends Component {
    componentDidMount() {
        BackHandler.addEventListener('hardwareBackPress', this.handleBackButton);
    }

    componentWillUnmount() {
        BackHandler.removeEventListener('hardwareBackPress', this.handleBackButton);
    }

    handleBackButton() {
        ToastAndroid.show('Back button is pressed', ToastAndroid.SHORT);
        return true;
    }

    render() {
        return (
            <View>
                <Text>Back button example</Text>
            </View>
        );
    }
}

module.exports = BackButtonDemo;

注意:

同时从您的解决方案中删除 this.props.navigator.pop();。

Navigator pop 函数将用户带到 Navigator 呈现的上一个屏幕。