Javascript 如何将ReactJS提交表单中的数据传递给AdonisJS

我在ReactJS中有一个表单，每次单击submit按钮，数据都应该传递给AdonisAPI

反应JS文件

  async handleSubmit(e) {
        e.preventDefault();

      console.log(JSON.stringify(this.state));
      await axios({
          method: 'post',
          url: 'http://127.0.0.1:3333/add',
          data: JSON.stringify(this.state),
      })
          .then(function (response) {
                console.log('response',response);
            })
            .catch(function (error) {
                console.log('error',error);
            });

    }

“”是具有路由“/add”的Adonis服务器

我不知道如何用Adonis写文章，在那条路线上发布状态

谁能给我解释一下吗？

• 在控制器的函数中，像这样获取值

  const data=request。只有（['data']）

  您才能获得数据
  

• 其他获取类似数据的方法

  const alldata=request.all（）

  此控制台将显示此结果并查看您得到的结果数量 并从此

  alldata.data

---

首先，创建一个简单的控制器来处理从ReactJS应用程序中的

handleSubmit（）

方法接收的数据

使用以下命令创建简单控制器：

adonis make:controller TestController --type http

创建后，打开

TestController

文件，创建

index

方法，并在

index

方法中添加以下内容

'use strict'

class TestController{
  // define your index method here 
 index ({ request }) {
    const body = request.post() // get all the post data;
    console.log(body) //console it to see the passed data
  }
}

module.exports = TestController

之后，在

start/routes.js

文件中注册您的

/add

路由

Route.post('/add', 'TestController.index') // controller name and the method

最后，点击ReactJS应用程序中的Submit按钮，并对其进行测试

发送请求时，您很可能会收到

CORS问题

从您的ReactJS应用程序到Adonis服务器，如果是这样，您必须

proxy

向Adonis服务器发出

api

请求

为此，请在ReactJS应用程序中打开您的

package.json

文件，并添加下面的

代理字段

"proxy": "http://127.0.0.1:3333",