BackHandler无法正常工作React Native

时间:2017-09-22 21:58:49

标签: android reactjs react-native redux react-navigation

当用户在Android上按下后退按钮时,我想回去。

我已经在屏幕上添加了监听器,并且在远程调试模式下它正在接收事件。但是当我不进行远程调试时,它无法正常工作。这真的很奇怪。

我要附上我写过的代码片段。

//Navigator
const BoardNavigator = StackNavigator({
    Board: { screen: Board }
});

//Board Component
class Board extends Component {
    componentWillMount () {
        BackHandler.addEventListener('hardwareBackPress', this._onBackPressed);
    }

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

    _onBackPressed () {
        console.log('backPress');
        goBack(this.props.navigation);
        return true;
    }

    onNext() {
        this.props.navigation.navigate("Board", {content: ...});
    }
}

其他信息: 这个BoardNavigator是rootNavigator(StackNavigator)的嵌套版本。

反应:'16 .0.0-alpha.12'

react-native:“0.47.2”

1 个答案:

答案 0 :(得分:1)

我实际上使用了像下面这样的反向处理程序来控制后退按钮,只需立即按下即可关闭应用程序。

componentDidMount() {
this._backPress = 0;

BackHandler.addEventListener('backPress', () => {
  setTimeout(() => {
    this._backPress = 0;
  }, 3000);

  this._backPress += 1;
  if (this._backPress <= 1) {
    ToastAndroid.showWithGravity(strings.BACK_BUTTON_ALERT, ToastAndroid.SHORT, ToastAndroid.CENTER);
    return true;
  }
  return false;
});