React Native無法讀取屬性未定義錯誤

Question

我正在開始對本機進行響應，並且嘗試通過按下按鈕從文本框中輸入一個簡單的控制台日志值。

我收到錯誤

無法讀取未定義的屬性“電子郵件”

。 該錯誤發生在console.log上。 我在這里做錯了什么？

LoginPage.js

import React, {Component} from 'react';
import {AppRegistry, Text, View, TextInput, Button} from 'react-native';


export default class LoginPage extends Component{
  constructor(){
    super()

    this.state = {
      email: '',
      password: '',
    }
  }

  static navigationOptions = {
    headerTitle: 'Login',
  };

  getUser(){
  /*  fetch('http://192.168.1.12:8000/login')
      .then(response => response.json())
      .then(response => {
        console.log(response);
      });
  */
    console.log(this.state.email);
    console.log(this.state.password);
  }

  render(){
    return(
      <View>
        <Text>Login Page</Text>


        <TextInput
          placeholder = "Email"
          onChangeText={(text) => this.setState({email: text})}
          //value={this.state.textValue}
          //onChangeText={(value) => this.onChangeText(value)}
          //onSubmitEditing={this.onSubmit}
        />

        <TextInput
          placeholder = "Password"
          secureTextEntry={true}
          onChangeText={(text) => this.setState({password: text})}
          //value={this.state.textValue}
          //onChangeText={(value) => this.onChangeText(value)}
          //onSubmitEditing={this.onSubmit}
        />

        <Button
          //onPress={() => this.props.navigation.navigate('RegisterPage')}
          title="Login"
          accessibilityLabel="Login"
          onPress={this.getUser}
        />

      </View>
    );
  }
}

AppRegistry.registerComponent('LoginPage', () => LoginPage);

Answer 1

您需要將getUser函數綁定到類實例。 您可以通過兩種方式做到這一點。 一個正在這樣的構造函數中做

constructor(){
    super()

    this.state = {
      email: '',
      password: '',
    }
    this.getUser = this.getUser.bind(this);
  }

或者您可以使用像這樣的arrow function語法

getUser = () => {
    console.log(this.state.email);
    console.log(this.state.password);
  }