axios.post 未从服务器返回数据:“无法解构‘(中间值)’的属性‘数据’,因为它未定义”

Posted

技术标签:

【中文标题】axios.post 未从服务器返回数据:“无法解构‘(中间值)’的属性‘数据’,因为它未定义”【英文标题】:axios.post not returning data from server: "Cannot destructure property 'data' of '(intermediate value)' as it is undefined" 【发布时间】:2021-04-18 01:35:14 【问题描述】:

我正在尝试通过 axios.post() 从服务器获取数据。

决定使用 POST 而不是 GET,因为我想发送一个带有 id 的数组以在数据库中查找,这可能太大而无法放入 GET 查询参数。

我设法在 POST 正文中发送了一个带有 id 的数组。这到达我的服务器。我可以成功找到数据库中的项目。然后在响应中返回这些项目。数据显示在 Chrome devtools > Network(状态 200)中。使用 Postman 手动发送请求时,我也会得到正确的东西。

似乎一切正常,但响应没有到达我在 axios 函数中的数据变量中。

我花了一天时间在这里尝试所有类似答案的解决方案。没有任何效果...

我还尝试了 GET 并改为在查询参数中发送 id,这会产生相同的错误。我怀疑我在 async/await 上做错了,因为我得到了这个“中间值”的东西。

提前感谢您的帮助。

CLIENT axios 函数

const url = 'http://localhost:5000';

export const getStuff = Ids => 
  axios.post(
    `$url/cart/stuff`,
    
      Ids: Ids,
    ,
    
      headers: 
        'Content-Type': 'application/json',
      ,
    
  );
;

客户操作

import * as api from '../api';

export const getStuff = Ids => async dispatch => 
  try 

    // Ids is an array like ["5fnjknfdax", "5rknfdalfk"]

    const  data  = await api.getStuff(Ids);
    // this gives me the error in the title, data never comes through

    //dispatch(-dolater-);

   catch (error) 
    console.log(error);
  
;

服务器控制器

export const getStuff = async (req, res) => 
  try 
    const  Ids  = req.body;
    const stuff = await STUFF.find().where('_id').in(Ids);
    console.log('SERVER', stuff);
    // this works until here. request comes through and
    // I can successfully find the stuff I want in the database
    res.status(200).json(stuff); // this also works, response is being sent
   catch (error) 
    res.status(404).json( message: error );
  
;

服务器路由

router.post('/cart/stuff', getStuff);

【问题讨论】:

axios 中的响应应该是实际值,所以除非您的响应中有数据字段,否则直接使用它。 【参考方案1】:

您在这里有一些额外的花括号(或缺少return,这取决于您如何看待它)。当您使用带有花括号的 lambda(箭头函数)时,您必须显式返回一个值,否则它将返回 undefined。从此更改您的代码:

export const getStuff = Ids => 
  axios.post(...);
;

到其中之一:

// Option 1
export const getStuff = Ids => 
  return axios.post(...);
;

// Option 2
export const getStuff = Ids => axios.post(...);

任何一种格式都会返回实际的 axios 承诺,而不是默认的 undefined。

【讨论】:

救命稻草!我知道这将是这样简单的事情。事后看来,错误消息也很有意义。谢谢!

以上是关于axios.post 未从服务器返回数据:“无法解构‘(中间值)’的属性‘数据’,因为它未定义”的主要内容,如果未能解决你的问题,请参考以下文章

flask axios post返回http状态码405/400

使用带有参数对象的 Axios Post 没有返回数据

Axios Post 200 响应后不返回数据

axios post请求报错

Laravel Vue - 控制台日志 Axios POST 响应与网络响应不同

vue学习总结