Express.js POST 请求不工作，不发送到数据库

Question

我正在一个网站上工作，该网站有一个基本的邮政编码，当我 go 到运行请求的 localhost 站点（在本例中为 localhost:3002/putElement）时，我收到消息“无法获取 /putElement”。

1. 我正在使用 Axios 和 NodeJS 来获取/发布信息到我的数据库中
2. app.get("", (req, res) => {}) function 有效，但在使用 app.post 时无效

反应代码：

import Axios from "axios";
export const SubmitItem = () => {
  const [name, setName] = useState("");
  const [description, setDescription] = useState("");
  const [itemsList, setItemsList] = useState([]);
  const postItem = () => {
    Axios.post("http://localhost:3002/putElement", {
      name: name,
      image: image,
      size: size,
      category: category,
      description: description,
      price: price,
      seller: seller,
    }).then(() => {
      setItemsList([
        itemsList,
        {
          name: name,
          image: image,
          size: size,
          category: category,
          description: description,
          price: price,
          seller: seller,
        },
      ]);
    });
  };
  console.log(itemsList);
  return (
    <div className="submitBody">
      <div className="container bg-white mt-3 mb-3">
        <div className="row">
          <div className="col-sm-2 m-4">
            <div className="mt-2">Item Title:</div>
            <br />
            <div className="mt-2">Description:</div>
          </div>
          <div className="col-sm-1"></div>
          <div className="col-sm-5 mt-2">
            <div className="mt-4">
              <input
                type="text"
                name=""
                id=""
                onChange={(e) => setName(e.target.value)}
              />
            </div>
            <div className="mt-4">
              <input
                type="text"
                name=""
                id=""
                onChange={(e) => setDescription(e.target.value)}
              />
            </div>
          </div>
        </div>
        <div className="mb-4" style={{ width: "50%" }}>
          <button type="submit" className="submitButton" onClick={postItem}>
            Submit
          </button>
        </div>
      </div>
    </div>
  );
};

节点代码：

const express = require("express");
const mysql = require("mysql");
const app = express();
const cors = require("cors");
app.use(cors());
app.use(express.json());

// Creating connection
let db = mysql.createConnection({
  host: "localhost",
  port: "3325",
  user: "root",
  password: "",
  database: "clothingstore",
});
app.post("/putElement", (req, res) => {
  res.send("works");
  const name = req.body.name;
  const description = req.body.description;
  const sql = `INSERT INTO shirt ( 'name', 'description') VALUES (?, ?)`;
  db.query(sql, [name, description], (err, result) => {
    res.send(result);
  });
});
app.listen(3002, () => {});

Answer 1

插入数据库的过程是一个promise，尝试清理你的ui代码。 看起来不太好，尝试使用 async await 看看

app.post("/putElement", async (req, res) => {
      res.send("works");
      const name = req.body.name;
      const description = req.body.description;
      const sql = `INSERT INTO shirt ( 'name', 'description') VALUES (?, ?)`;
      await db.query(sql, [name, description], (err, result) => {
        res.send(result);
      });
    });