React Native setState из BackHandler не работает должным образом

Question

Я пытаюсь обновить состояние своего класса приложения с помощью функции BackHandler (при нажатой кнопке «Назад»). Я делаю что-то неправильно? Вот мое приложение. js

export default class App extends React.Component {
  constructor(props) {
    super(props)
    this._changeDisplayOpt = this._changeDisplayOpt.bind(this)
  }

  state = {
    screen: "room",
  }

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

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

  handleBackButton() {
    if(this.state.screen == "room"){
      this.setState({screen:'home'});
    }
    return true;
  }

  render(){
    return(
      <View style={styles.container}>
         <Text>{this.state.screen}</Text>
      </View>
    );
  };
}

Это дает мне эту ошибку

TypeError: undefined is not an object (evaluating 'this.state.screen')

Answer 1

Вам нужно привязать свою функцию, как показано ниже

export default class App extends React.Component {
    constructor(props) {
        super(props)
        this.handleBackButton = this.handleBackButton.bind(this);
    }

    state = {
        screen: "room",
    }

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

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

    handleBackButton() {
        if (this.state.screen == "room") {
            this.setState({ screen: 'home' });
        }
        return true;
    }

    render() {
        return (
            <View style={styles.container}>
                <Text>{this.state.screen}</Text>
            </View>
        );
    };
}

Answer 2

Удалить эту строку:

constructor(props) {
    super(props)
  }