如何在 fetch 中检索对象属性数组，然后将其传递给第二个 fetch 调用？

Question

我有一个依赖于 2 个端点来检索所需程序名称的组件。我有 2 个端点。第一个端点返回程序列表，它是一个对象数组。目前，它只返回 4 个程序（2 个程序 ID 为“13”，另外两个程序 ID 为“14”）。第二个端点依赖于这些程序 id，我需要以某种方式将它传递给第二个端点，避免重复，并用逗号分隔。例如：

首先获取调用响应：

{

  "programs": [

    { "id": 1, "organization": {"organizationId": 2000}, "programId": 13 },

    { "id": 2, "organization": {"organizationId": 2001 }, "programId": 13 },

    { "id": 22, "organization": {"organizationId": 2002 }, "programId": 14 },

    { "id": 20, "organization": {"organizationId": 2000 }, "programId": 14 }

  ]

}

第二次获取调用：api/v1/program/programlist/13,14

在代码中，这是我到目前为止所做的：

fetch('/api/v1/organizationrelationship/organizationprograms', {

  method: 'GET',

  headers: {

    'Content-Type': 'application/json',

  }

})

.then(res => res.json())

.then(res => {

  if(res) {

    _.map(res.programs, (program, index) => {

      fetch(`/api/v1/program/programlist/${program.programId}`, { // this is passing all 4 programId individually

        method: 'GET',

        headers: {

          'Content-Type': 'application/json',

        }

      })

      .then(res => res.json())

      .then(res => {

        if(res) {

          console.log("res: ", res)

        }

      })

    })

  }

})

我正在寻找的所需工作流程：

1. 第一次 fetch 调用成功

2. 然后转到第二个 fetch 调用

3. 并在 url 中传入 programIds

4. api/v1/program/programlist/13,14

5. 然后我将响应保存在组件的状态中

Answer 1

试试下面的代码片段，它应该可以解决问题。fetch('/api/v1/organizationrelationship/organizationprograms', {  method: 'GET',  headers: {    'Content-Type': 'application/json',  }}).then(res => res.json()).then(res => {  if(res) {    // gets all the ids from the response and make them a set to remove duplicate    let ids = new Set(res.proprams.map( (program, index) => return program.programId));    // convert the set into and array and the use the toString function to make them comma seperated    let params = Array.from(ids).toString()      fetch(`/api/v1/program/programlist/${params}`, { // this is passing all 4 programId individually        method: 'GET',        headers: {          'Content-Type': 'application/json',        }      })      .then(res => res.json())      .then(res => {        if(res) {          //here you can now save the response to state          console.log("res: ", res)        }      })  }})