Question

我似乎无法使用表格，但出现错误 可能的未处理的承诺拒绝（id：0）：

我将两个组件结合在一起用于个人应用程序，两者均独立工作。一个是使用MongoDB的有效登录表单，另一个是使用其他人编写的屏幕进行反应导航。

android {       // line 7 of build.gradle (module App)
    compileSdkVersion 28
    buildToolsVersion "29.0.2"
    defaultConfig {
        applicationId "com.example.web_app"
        minSdkVersion 15    // change this to 16
        targetSdkVersion 29
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
    }

import strings from "./strings";
//import styles from "./styles";
import React, { Component } from "react";
import {
  Text,
  StyleSheet,
  View,
  Platform,
  Alert,
  Image,
  ImageBackground
} from "react-native";
import { Button } from "react-native-elements";
import { NavigationScreenProps } from "react-navigation";

import LoginForm from "../../../components/LoginForm";
import axios from "axios";
import baseUrl from "../../../baseUrl";
axios.defaults.baseURL = baseUrl;

class LoginScreen extends Component<NavigationScreenProps> {
  static navigationOptions = {
    header: null
  };

  constructor(props) {
    super(props);
    this.state = {
      email: "test@test.com",
      password: "secretPassword999",
      errorMessage: ""
    };
    this.handleChange = this.handleChange.bind(this);
    this.handleSignIn = this.handleSignIn.bind(this);
    this.handleSignUp = this.handleSignUp.bind(this);
  }

  handleChange(name, value) {
    this.setState({
      [name]: value
    });
  }

  async handleSignUp() {
    try {
      const { email, password } = this.state;
      await axios.post("/auth/signup", { email, password });
      this.handleSignIn();
    } catch (error) {
      this.setState({ errorMessage: error.response.data.message });
    }
  }

  async handleSignIn() {
    try {
      this.setState({ errorMessage: "" });
      const { email, password } = this.state;
      const result = await axios.post("/auth/login", { email, password });
      Alert.alert("", result.data.token);
      console.log(result);
      this.props.handleChange("token", result.data.token);
    } catch (error) {
      this.setState({ errorMessage: error.response.data.message });
    }
  }

  render() {
    return (
      <View style={styles.container}>
        <ImageBackground
          source={require("../../../images/blur.jpg")}
          style={{
            flex: 1,
            position: "relative",
            resizeMode: "cover"
          }}
        >
          <Text style={styles.headerText}> Title</Text>
          <Text style={styles.headerSmall}>Service</Text>
          <LoginForm
            email={this.state.email}
            password={this.state.password}
            handleChange={this.handleChange}
            handleSignIn={this.handleSignIn}
            handleSignUp={this.handleSignUp}
          />
          <Text style={styles.errorMessage}>{this.state.errorMessage}</Text>
          {/*<Image
          source={require("../../../images/image.jpg")}
          style={styles.logo}
        />*/}
          <Button
            buttonStyle={{ backgroundColor: "transparent" }}
            title={strings.forgottenPassword}
            onPress={() =>
              this.props.navigation.navigate("PasswordResetScreen")
            }
          />
          <Button
            buttonStyle={{ backgroundColor: "transparent" }}
            title={strings.loginTitle}
            onPress={() => this.props.navigation.navigate("HomeScreen")}
          />
        </ImageBackground>
      </View>
    );
  }
}

export default LoginScreen;

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#6B52AE" 
  },
  errorMessage: {
    marginHorizontal: 22,
    fontSize: 18,
    color: "#fff",
    fontWeight: "bold",
    textAlign: "center"
  },
  headerText: {
    fontSize: 44,
    textAlign: "center",
    marginBottom: 0, 
    color: "#FFF",
    fontFamily: Platform.OS === "android" ? "sans-serif-light" : undefined,
    marginTop: 30,
    fontWeight: "bold"
  },
  headerSmall: {
    fontSize: 24,
    textAlign: "center",
    marginBottom: 20, 
    color: "#FFF",
    fontFamily: Platform.OS === "android" ? "sans-serif-light" : undefined,
    marginTop: 0,
    fontWeight: "200"
  },
  logo: {
    height: 210,
    width: 360,
    marginLeft: 51,
    alignSelf: "center"
  }
});

Answer 1

this.setState（{errorMessage：error.response.data.message}）;

TypeError：无法读取未定义的属性“数据”

error.response似乎是undefined。

如果HTTP之外发生诸如“未找到域”之类的错误，则error.response将是undefined。即使正确实施，有时也会发生此类错误，应在错误处理中予以考虑。

您提供的信息尚不清楚您的情况下访问失败的原因。 console.log(err)将为您提供更多信息。

提交表格时可能出现未处理的承诺拒绝（id：0）

1 个答案: