javascript - Axios POST 请求数据显示为未定义

Question

为此，我正在使用 React、NodeJS 和 Express。我正在使用一个表单，一旦提交表单，就会调用一个将数据发送到后端的函数。在 react 包中设置了代理。这是 React 应用程序中的代码：

import React from "react";
import { useState } from "react";
const axios = require('axios');

const Target = () => {
    const [Val, setVal] = useState('');

    const sendVal = (e) => {
        e.preventDefault();
        axios.post('/api', {
            TGVAL:Val
        })
        .then(function (response) {
            console.log(response);
        })
    }

    return(
        <div className="TargetPrice">
            <form onSubmit={sendVal}>
                <label htmlFor="inputTarget">At what value do you want the alert?</label>
                <br />
                <input type="text" className="inputTarget" value={Val} onChange={(e) => setVal(e.target.value)} />
                <button style={{marginLeft:"5px"}} type="submit">Submit</button>
            </form>
        </div>
    )
}
export default Target;

这是后端代码：

const express = require("express");
const PORT = process.env.PORT || 3001;
const app = express();

app.post('/api', (request, response) => {
  console.log(request.TGVAL);
})

每当提交表单时，都会在后端记录“未定义”。

我知道后端正在接收一些数据，因为每次提交表单时，它都会记录未定义。问题是它没有记录表单中的数据。

对此的任何帮助将不胜感激。

编辑：由于 Jaromonda X，问题已得到解决。添加app.use(express.json())和request.body.TGVAL

标签： javascriptnode.jsreactjsexpressaxios