У меня возникла ошибка создания при реакции. js application - PullRequest
1 голос
/ 17 июня 2020

Я новичок в React. js и material-ui. Я пытаюсь создать простую форму регистрации, но получаю ошибку. Я протестировал свой бэкэнд на бессонницу, и все его маршруты работают, поэтому я считаю, что моя ошибка находится на моей стороне. Мой сценарий регистрации приведен ниже. Кстати, моя ошибка говорит только о том, что это ошибка создания. Вы можете мне помочь?

import React from 'react';
import { style } from './styles';
import Button from '@material-ui/core/Button';
import CssBaseline from '@material-ui/core/CssBaseline';
import TextField from '@material-ui/core/TextField';
import Link from '@material-ui/core/Link';
import Grid from '@material-ui/core/Grid';
import Typography from '@material-ui/core/Typography';
import Container from '@material-ui/core/Container';
import { useState } from "react";
import api from "../../services/api"

function Cadastro() {

  const classes = style();

  const [nome, setNome] = useState("");
  const [email, setEmail] = useState("");
  const [cpf, setCpf] = useState("");
  const [senha, setSenha] = useState("");
  const [rg, setRg] = useState("");
  const [data_nascimento, setDataNascimento] = useState("");

  async function save(){

    try{
      await api.post('/cadastro', {
        nome,
        cpf,
        email,
        rg,
        data_nascimento,
        senha
      })
    }catch(err){
      console.log(err)
    }
  }



  return (
    <Container component="main" maxWidth="xs">
      <CssBaseline />
      <div className={classes.paper}>
        <Typography component="h1" variant="h5">
          Cadastro
        </Typography>
        <form className={classes.form} noValidate>
          <Grid container spacing={2}>
            <Grid item xs={12} sm={6}>
              <TextField
                // value={nome}
                required
                fullWidth
                id="nome"
                label="Nome"
                onChange={e => setNome(e.target.value)}
              />
            </Grid>
            <Grid item xs={12} sm={6}>
              <TextField
                required
                fullWidth
                id="cpf"
                label="CPF"
                // value={cpf}
                onChange={e => setCpf(e.target.value)}
              />
            </Grid>
            <Grid item xs={12}>
              <TextField
                required
                fullWidth
                id="email"
                label="Email"
                // value={email}
                onChange={e => setEmail(e.target.value)}
              />
            </Grid>
            <Grid item xs={12}>
              <TextField
                required
                fullWidth
                // value={senha}
                label="Senha"
                type="password"
                id="senha"
                onChange={e => setSenha(e.target.value)}
              />
            </Grid>
            <Grid item xs={12}>
              <TextField
                required
                fullWidth
                // value={rg}
                label="RG"
                id="rg"
                onChange={e => setRg(e.target.value)}
              />
            </Grid>
            <Grid item xs={12}>
              <TextField
                required
                fullWidth
                // value={data_nascimento}
                type="date"
                id="data_nascimento"
                onChange={e => setDataNascimento(e.target.value)}
              />
            </Grid>
          </Grid>
          <Button
            type="submit"
            fullWidth
            variant="contained"
            color="primary"
            className={classes.submit}
            onClick={save}
          >
            Cadastrar
          </Button>

        </form>
      </div>

    </Container>
  );
}

export default Cadastro;

РЕДАКТИРОВАТЬ 1: Моя ошибка:

Error: "Request aborted"
    createError createError.js:16
    handleAbort xhr.js:73
    index.js:36

The development server has disconnected.
Refresh the page if necessary. webpackHotDevClient.js:76

[HMR] Waiting for update signal from WDS... log.js:24

Индексный файл - это код, указанный выше.

Теперь мой скрипт api ниже:

import axios from 'axios';

const api = axios.create({
  baseURL: 'http://localhost:5000'
});

export default api;
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...