React中Axios请求的问题

栏目: ios · 发布时间: 2021-05-07

简介  这篇文章主要介绍了React中Axios请求的问题以及相关的经验技巧,文章约2041字,浏览量184,点赞数3,值得参考!

我试图启动一个后Axios请求从我的前面到我的后面使用React框架。当我使用我的localhost服务器,它的工作,但我使用Heroku地址,我有一个错误消息(400坏的请求)在我的控制台.我试图启动其他得到Axios请求与heroku和它的工作。因此,我想知道,我的问题是相关的Post Axios请求。我将感谢你的意见

请在下面找到我的代码(前面的反应)。

import React from "react";

import axios from "axios";

const Questions = () => {
  const fetchData = async () => {
    const response = await axios.post(
      "https://formnest-back-certification.herokuapp.com/form/create",
      {
        title: "nouveau formulaire",
      }
    );

    console.log(response.data);
  };

  fetchData();

  return (
    <>
      <div>Hello form</div>
    </>
  );
};
export default Questions;

这是我的代码在后面的React。

router.post("/form/create", async (req, res) => {
  try {
    /* const titleForm = await Form.findOne({ title: req.fields.title });
    console.log(titleForm);

    if (titleForm) {
      return res.status(400).json({ error: "title already used" });
    } else { */
    if (req.fields.title) {
      const newForm = new Form({
        title: req.fields.title,
        /* questions: req.fields.questions,
          answers: req.fields.answers, */
      });

      // Sauvegarde du formulaire
      await newForm.save();
      return res.json(newForm);
    } else {
      return res.status(400).json({ error: "Missing parameters" });
    }
  } catch (e) {
    return res.status(400).json({ error: e.message });
  }
  /*  console.log(req.fields); */
  /* 
  res.json({ message: "form created" }); */
});

Screen shot of my console further to my post axios request

答案

如果你是使用快递框架的POST请求,你需要使用 body-parser 模块,然后用 req.body 来检索请求数据。

req.fields是当你使用 express-formidable 模块。


以上就是本文的全部内容,希望对大家的学习有所帮助,本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。

解决react项目中跨域和axios封装使用(示例代码)

十React 获取服务器数据: axios插件、 fetch-jsonp插件的使用

React网络请求(示例代码)

react axios的二次封装

react-native 请求封装(示例代码)

如何在React中处理REST API请求(示例代码)

react 使用axios(示例代码)

Reactjs之Axios、fetch-jsonp获取后台数据(示例代码)