axios 不向后端发送数据

问题描述 投票:0回答:1

我的后端有以下代码

import { Request, Response } from "express";
import * as yup from "yup";
import ElectionContract, { web3 } from "../../web3";

const schema = yup.object({
  req: yup.object({
    name: yup.string().min(3).required(),
    description: yup.string().min(10).required(),
    candidates: yup.array(
      yup.object({
        name: yup.string().min(3),
        info: yup.string().min(10),
      })
    ),
  }),
});

export default async (req: Request, res: Response) => {
  try {
    await schema.validate(req);
  } catch (error: any) {
    return res.status(400).send(error.errors);
  }
};

前端代码是

 if (candidatesError === ""&&
name!==""&&description!=="") {
            axios
              .post("/polls/start",{name,description, candidates})
              .then((_) => {
                window.location.reload();
              })
              .catch((err) => {
                let error = err.message;
                if (err?.response?.data) error = err.response.data;
                setError(error);
                setLoading(false);
              });
          }
        }}

我已经确保名称和描述不能为空但是当我进行调用模式验证时说 req.name 是后端的必填字段。

如何解决错误?我正在学习 react.js 和 node.js 如果这是一个蹩脚的问题,我深表歉意

reactjs post axios request yup
1个回答
0
投票

yup.object() 方法需要一个对象,其键与模式中定义的字段名称相匹配。在您的例子中,模式定义了一个名为 req 的字段,它是一个包含字段名称、描述和候选字段的对象。因此,您应该将请求主体作为具有包含这些字段的 req 属性的对象传递,如下所示:

await schema.validate({ req: req.body });

这将确保根据模式正确验证请求正文。

此外,值得注意的是,您提供的前端代码似乎在 if 语句条件中存在逻辑错误。当前条件检查 candidatesError 是否为空或者名称和描述是否为空。这意味着如果 candidatesError 不为空但 name 和 description 为空,axios.post() 调用仍将进行,这可能会导致服务器端的验证错误。建议更新条件以检查 candidatesError 是否为空以及 name 和 description 是否不为空,如下所示:

if (candidatesError === "" && name !== "" && description !== "") {
  // make axios.post() call
}

© www.soinside.com 2019 - 2024. All rights reserved.