时间戳

首页 > 解决方案 > axios 响应格式对象 vs 数组

javascript - axios 响应格式对象 vs 数组

问题描述

我正在使用 axios/vue 来获取一些数据，目前其中一些调用是手动设置的。我需要自动化所有这些，我几乎成功了，但我得到的数据不正确。

这是我当前的“手动”设置：

let linksArr = ['abc.json','def.json'];
axios
    .all(linksArr.map(l => axios.get(l)))
    .then(
      axios.spread(function(abc, def) {
        var merged = [...abc.data, ...def.data]
      })
    )

我在这个设置中得到了这样的回应：

(2) [{…}, {…}]
0: {}
1: {}

但是当我将它更改为像这样更“自动”的东西时（linkArr 是动态的并且可能很长）：

let linksArr = ['abc.json','def.json'];
axios
   .all(linksArr.map(l => axios.get(l)))
   .then(
     responses => {
       var merged = [].concat(responses.map(res => res.data));
     }
   );

我得到这个作为回应（注意 [{}]）：

(2) [Array(1), Array(1)]
0: [{…}]
1: [{…}]

我想为响应（对象与数组）保持相同的格式，但我不知道该怎么做......

谢谢。

标签： javascriptarraysaxios

解决方案

在后一个示例中，您的回调有误。您在原始代码中所做的是连接传播项目 ( ...ARG.data)，而在后一个代码中，您缺少这部分。请检查以下工作示例：

let linksArr = ['abc.json','def.json'];
axios
   .all(linksArr.map(l => axios.get(l)))
   .then(responses => {
     const merged = responses
      .map(r => r.data)
      .reduce((acc, item) => [...acc, ...item], []);
   });

https://codesandbox.io/s/j25l1n7835

推荐阅读