undefined не является объектом (оценивает this.state), но добавил bind (this) в мой вызов метода

Question

В своем приложении я добавил Touchable Opacity, когда нажимаю на него, мне нужно запустить функцию.

<TouchableOpacity
        activeOpacity={0.9}
        style={styles.Button}
        onPress={this.login_account.bind(this)}
      >
        <Text style={styles.ButtonText}>Login</Text>
</TouchableOpacity>

Когда я пытаюсь установить this.setState внутри этой функции, выдается предупреждение

Что я не так сделал в этом?

Это моя функция login_account

login_account() {
    let username = this.state.username;
    let password = this.state.password;

    error_message = "";
    has_error = false;
    if (username == "" || password == "") {
      error_message += "Username and password should no be empty.";
    }
    if (has_error == false) {

      //code here....

    } else {
      this.setState({
        status_code: 6001,
        message: error_message,
        show_popup: true
      });
    }
  }

Answer 1

Вы можете просто реализовать свою функцию как функцию стрелки, тогда вам больше не нужно ее связывать:

Итак, ваша функция будет выглядеть так:

login_account = () => {
   // your code here

}

и измените свойство функции в ваших Touchable компонентах так:

<TouchableOpacity
        activeOpacity={0.9}
        style={styles.Button}
        onPress={this.login_account}
      >
        <Text style={styles.ButtonText}>Login</Text>
</TouchableOpacity>

Answer 2

Возможно, что this, к которому вы привязываете функцию, не относится к компоненту, в зависимости от того, где находится этот код.

Попробуйте использовать любое связывание в конструкторе:

constructor(props) {
    super(props);
    ...
    this.login_account = this.login_account.bind(this);
}

Или превращение метода login_account в функцию стрелки, чтобы она не переопределяла this:

login_account = () => {
    ...
};