React 中的 Axios 400 错误请求

Question

我已阅读此处有关 Axios 400 错误请求的所有问题，但找不到解决方案。 我有一个在 useEffect 期间调用的函数，它首先从我的 API 获取数据，然后根据其他因素可能需要 POST 回 API。

GET 调用完美无缺，但 POST 调用一直失败。

const home = match.homeTeam.team_name
const homeScore = null
const away = match.awayTeam.team_name
const awayScore = null
const gameID = match.fixture_id
const result = ""
const points = null
const teamName = userInfo.state.teamName
const date = match.event_date
const status = match.statusShort
const realHomeScore = null
const realAwayScore = null
const homeLogo = match.homeTeam.logo
const awayLogo = match.awayTeam.logo
axios.post('/picks/add/', { home, homeScore, away, awayScore, gameID, result, points, teamName, date, status, realHomeScore, realAwayScore, homeLogo, awayLogo })
            .then((result) => {
                console.log(result.data);
            })
            .catch((error) => {
                console.log(error);
            })

我已经在网络中检查了我的有效负载，它正在发送我想要的东西。

我在 Catch 中收到以下错误消息：

Error: Request failed with status code 400
    at createError (createError.js:17)
    at settle (settle.js:19)
    at XMLHttpRequest.handleLoad (xhr.js:60)

该路由在 Postman 中运行良好，我在其中创建的 POSTS 与我在网络上的请求中的有效负载完全匹配。 但由于某种原因，他们失败了。

这是否与在同一个函数中向同一个 API 发出两个请求有关？ 我的第一个请求是在 Await 中，所以它在函数的其余部分运行之前运行并完成。

任何输入将不胜感激，谢谢！

Answer 1

您可以在 catch 块中使用console.log(error.response)来获得更易读的对象。

编辑： axios错误分为三种类型： message 、 request和response 。 为了确保您处理所有可能的错误，您可以使用条件块：

if (error.response){

//do something

}else if(error.request){

//do something else

}else if(error.message){

//do something other than the other two

}