【发布时间】：2020-06-20 06:25:16
【问题描述】：
这让我发疯了！
我有一个 axios 调用在控制台中返回一个 json 数组对象 - 检查！
>(100) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
>0:
id: 54892250
iid: 1001
ref: "master"
sha: "63e3fc014e207dd4e708749cee3e89a1aa416b7d"
created_at: "2020-03-05T18:57:02.793Z"
updated_at: "2020-03-05T19:06:27.651Z"
>user: {id: someuserid, name: "someuser", username: "someusername", state: "active", avatar_url: "https://assets.gitlab-static.net/uploads/-/system/user/avatar/4534925/avatar.png", …}
>environment: {id: 123456, name: "somename", slug: "somename-iw5iqp", external_url: "https://someaddress.com"}
>deployable: {id: someid, status: "success", stage: "deploy", name: "deploy-staging", ref: "master", …}
status: "success"
__proto__: Object
>1: {id: 54804365, iid: 1000, ref: "filter-out-expired-items", sha: "6225d8018c86fa906063aeea5c10c710ddced14c", created_at: "2020-03-05T12:25:18.949Z", …}
>2: {id: 54804175, iid: 999, ref: "master", sha: "aa5e50c50ba95e9b16cbc57fb968bf9075c625b2", created_at: "2020-03-05T12:24:02.284Z", …}
>3: {id: 54801934, iid: 998, ref: "filter-out-expired-items", sha: "4fc2
现在我需要对这个结果做两件事：
- 当完全展开时，这个响应很大——而且有数千个。而不是在 vuex 状态下存储 1000 个巨大的 json 响应 - 我想首先只提取我们关心的值，这些值如下：
- 身份证
- 参考
- 环境名称
- 状态
- deployable.tag
类似于：
{ "id": id, "ref": ref, "environment": environment.name, "status": status, "tag": deployable.tag, }
我该怎么做？
- 此响应在上面的许多页面上进行了分页，这只是一个页面结果的部分示例。
我有一个工作循环，我正在为所有这些循环获取 console.log。但我需要做的是在我提交状态之前连接所有页面（现在剥离到上述字段）。如果尝试过对象副本，推送到数组和各种有前途的实用程序 - 但我无法让它们中的任何一个工作:)
总之：
- 获取页面结果
- 将数组中的项目压缩为简化版本
- 将它们全部收集到我可以插入状态的对象中
循环的相关部分
// Use headers to get the number of pages
const pages = await axios.head(url, options)
.then((response) => response.headers['x-total-pages']);
console.log('pages=', pages); // DEBUG
// Loop through and push them to an array
for (let i = 0; i <= pages; i += 1) {
console.log('i=', i);
options = {
headers: {
'Private-Token': token,
},
params: {
order_by: 'created_at',
sort: 'desc',
per_page: 100,
page: i,
},
};
axios.get(url, options)
.then((result) => { console.log(result.data); })
}
【问题讨论】：
-
你能贴出你的子数组（页面数组/列表）结构吗
-
这是我正在使用的 Gitlab 的 API - 他们有很好的文档和示例响应部署 api docs.gitlab.com/ee/api/… 他们的分页 docs.gitlab.com/ee/api/README.html#pagination
-
我正在努力制定我所知道的简洁的目标:) 但基本上它是一年多部署统计数据的总结。他们每年可以得到 3000-4000 个结果，这就是为什么我认为在将数据集放入状态之前对其进行拟合很重要
-
当您异步执行所有请求时，您将失去排序，并且您不会真正知道所有请求何时完成。当所有请求承诺都已解决时，您可以使用
Promise.all()。这就是你想要的吗？
标签： javascript vue.js state vuex