如何修复 AxiosError 中 node_modules\axios\lib\core\AxiosError.js:null 的网络错误

Question

When i Call The API For User Creating using React Native, Get an Error and no any Response on click and no any data print on console...

we get the error like

Network Error at node_modules\axios\lib\core\AxiosError.js:null in AxiosError at node_modules\axios\lib\adapters\xhr.js:null in handleError at node_modules\event-target-shim\dist\event-target-shim.js:null in EventTarget.prototype.dispatchEvent at node_modules\react-native\Libraries\Network\XMLHttpRequest.js:null in setReadyState at node_modules\react-native\Libraries\Network\XMLHttpRequest.js:null in __didCompleteResponse at node_modules\react-native\Libraries\vendor\emitter\EventEmitter.js:null in emit at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in __callFunction at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in __guard$argument_0 at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in __guard at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in callFunctionReturnFlushedQueue

import { View, Text, TextInput, Button, StyleSheet } from "react-native";
import React from "react";
import { Formik } from "formik";
import * as yup from "yup";
import axios from "axios";


const initialValue = {
  name: "",
  email: "",
  password: "",
};

const validationSchema = yup.object({
  name: yup
    .string()
    .trim()
    .required("Name is Missing"),
  email: yup
    .string()
    .email("Invalide Email ")
    .required("Email is Missing "),
  password: yup
    .string()
    .trim()
    .required("Password is Missing")
    .min(8, "Password is too Short!"),

  repassword: yup.string().required("Re-Password is Missing !"),
});

const handleSignup = async (values, formikActions) => {
  try {
    const {data} = await axios.post("http//:192.168.0.103:4000/register", {
      ...values,
    }); 
    console.log(data);
    formikActions.resetForm();
    formikActions.setSubmitting(false);
  } catch (error) {
    console.log(error);
  }
};
const SignupScreen = (props) => {
  return (
    <Formik
      initialValues={initialValue}
      validationSchema={validationSchema}
      onSubmit={handleSignup}
    >
      {({
        errors,
        values,
        touched,
        handleBlur,
        handleChange,
        handleSubmit,
      }) => {
        // console.log(errors, values);
        return (
          <>
            <View style={aicaas.container}>
              <Text style={{ fontSize: 22, color: "grey" }}>
                User Registration
              </Text>
              <View style={aicaas.inputcontainer}>
                <Text style={{ color: "red" }}>
                  {touched.name && errors.name ? errors.name : ""}
                </Text>
                <TextInput
                  style={aicaas.input}
                  onChangeText={handleChange("name")}
                  value={values.name}
                  onBlur={handleBlur("name")}
                  placeholder="Name"
                />
              </View>
              <View style={aicaas.inputcontainer}>
                <Text style={{ color: "red" }}>
                  {touched.email && errors.email ? errors.email : ""}
                </Text>
                <TextInput
                  style={aicaas.input}
                  onChangeText={handleChange("email")}
                  keyboardType="email-address"
                  value={values.email}
                  placeholder="Email"
                />
              </View>
              <View style={aicaas.inputcontainer}>
                <Text style={{ color: "red" }}>
                  {touched.password && errors.password ? errors.password : ""}
                </Text>
                <TextInput
                  style={aicaas.input}
                  onChangeText={handleChange("password")}
                  value={values.password}
                  placeholder="Password"
                  secureTextEntry={true}
                />
              </View>
              <View style={aicaas.inputcontainer}>
                <Text style={{ color: "red" }}>
                  {touched.repassword && errors.repassword
                    ? errors.repassword
                    : ""}
                </Text>
                <TextInput
                  style={aicaas.input}
                  onChangeText={handleChange("repassword")}
                  value={values.repassword}
                  placeholder="Re-Password"
                />
              </View>
              <View style={aicaas.inputcontainer}>
                <Button onPress={handleSubmit} title="Register" />
              </View>
            </View>
          </>
        );
      }}
    </Formik>
  );
};

const aicaas = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
  },
  input: {
    borderWidth: 2,
    borderRadius: 5,
    height: 50,
    borderColor: "grey",
    marginTop: 10,
    backgroundColor: "whitesmoke",
    paddingHorizontal: 10,
    fontSize: 20,
  },
  inputcontainer: {
    width: "80%",
    marginTop: 20,
  },
});

export default SignupScreen;

Answer 1

I think the error is from the endpoint http//:192.168.0.103:4000/register .

It should be http://192.168.0.103:4000/register

ie http:// not http//: