Question

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

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

      this.props.navigator.pop();

       return false;
   });

Answer 1

如果要禁用默认的后退按钮行为，则需要返回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弹出式功能会将用户带到Navigator呈现的上一个屏幕。

Answer 2

Shiny 使用react hooks的新实现：

"detail": "You do not have permission to perform this action."

Answer 3

我通过在App.js

中添加此代码来禁用整个应用程序的后退按钮（android）

componentDidMount() {
  BackAndroid.addEventListener('hardwareBackPress', this.handleBackButton);
}

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

handleBackButton() {
  return true;
}

不要忘记导入BackAndroid

import {BackAndroid} from 'react-native'

Answer 4

只需返回true

即可尝试此禁用后退按钮

import {BackAndroid} from 'react-native';

componentWillMount() {
   BackAndroid.addEventListener('hardwareBackPress', () => {return true});
}

Answer 5

如果您正在使用反应 - 讨论，那么您需要使用BackHandler代替BackAndroid

import { BackHandler } from 'react-native';

// code

componentDidMount() {
  BackHandler.addEventListener('backPress');
}

// some more code

componentWillUnmount() {
  BackHandler.removeEventListener('backPress');
}

Answer 6

使用 react-navigation ：

时，只是为了给您一个完整的答案

如果您正在使用react-navigation，请将以下内容放在 RootNavigation类而不是App.js中，以便禁用整个应用程序的后退按钮。

import { BackHandler } from 'react-native';

componentDidMount() {
    BackHandler.addEventListener('hardwareBackPress', this.onBackButtonPressed);
}

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

onBackButtonPressed() {
    return true;
}

Answer 7

点击硬件后退按钮OnBackPressed回调被调用

你可以在onBackPressed回调中删除超级声明。

 @Override
    public void onBackPressed() {

    }

Answer 8

使用react native的BackHandler为我工作。只需在您的ComponentWillMount中添加以下行即可：

BackHandler.addEventListener（'hardwareBackPress'，function（）{return true}）它将在Android设备上禁用后退按钮。

Answer 9

禁用后退按钮以进行模块反应导航，使用钩子useFocusEffect

const hardwareBackPressCustom = useCallback(() => {
        return true;
    }, []);

useFocusEffect(() => {
    BackHandler.addEventListener('hardwareBackPress', hardwareBackPressCustom)
    return () => {
      BackHandler.removeEventListener('hardwareBackPress', hardwareBackPressCustom)
    };
  }, []);

为React Native防止硬件后退按钮android

9 个答案: