如何为每个 ID 在地图函数中获取项目

Question

我正在尝试使用 Wordpress API 获取一些数据，我需要根据 restbase 和 ID 执行此操作。

我有一个如下所示的数组：

const array = [
    {
        taxonomy: 'category',
        rest_base: 'categories',
        id: [ 1, 2 ]
    },
    {
        taxonomy: 'post_tag',
        rest_base: 'tags',
        id: [ 4, 5, 6, 7 ]
    }
];

这是地图函数：

array.map( ({ rest_base, id }) => {
    console.log( rest_base ); // categories or tags
    console.log( id ); // array of id's

    // Do a call here for each id
});

我需要以某种方式获取所有个人 ID，以便我可以像这样拨打电话：

example.com/wp-json/wp/v2/<rest_base>/<id>

有人可以帮我吗？

Answer 1

用 Array.flatMap() 迭代外部数组，用 Array.map() 迭代 id 数组，用 fetch 或类似的 API 进行调用，你会得到一个数组承诺：

const array = [{"taxonomy":"category","rest_base":"categories","id":[1,2]},{"taxonomy":"post_tag","rest_base":"tags","id":[4,5,6,7]}];

const result = array.flatMap( ({ rest_base, id }) => 
  id.map(v => `example.com/wp-json/wp/v2/${rest_base}/${v}`) // wrap the string with a fetch or similar function
);

console.log(result);

如果您不能使用 Array.flatMap()，请使用嵌套的 Array.map() 调用，并通过扩展到 Array.concat():

来展平

const array = [{"taxonomy":"category","rest_base":"categories","id":[1,2]},{"taxonomy":"post_tag","rest_base":"tags","id":[4,5,6,7]}];

const result = [].concat(...array.map( ({ rest_base, id }) => 
  id.map(v => `example.com/wp-json/wp/v2/${rest_base}/${v}`) // wrap the string with a fetch or similar function
));

console.log(result);

Answer 2

您可以使用任何 http 请求库。使用浏览器的 fetch API with async / await 的最简单方法：

const resultArray = array.map( async({ rest_base, id }) => {
    console.log( rest_base ); // categories or tags
    console.log( id ); // array of id's

    return id.map(id => await fetch(`example.com/wp-json/wp/v2/${rest_base}/${id}`));

});

await 函数将return 调用的结果。这样你就可以同步获取数据。获取数据异步是可以的，您可以创建一个承诺数组并使用 Promise all:

const promiseArray = array.map( async({ rest_base, id }) => {
    console.log( rest_base ); // categories or tags
    console.log( id ); // array of id's

    return id.map(id => return fetch(`example.com/wp-json/wp/v2/${rest_base}/${id}`));
});

const result = Promise.all(promiseArray);

Answer 3

我可能会使用 Array.prototype.reduce 创建一个对象，其中键是您的 rest_base 值，值是相应的 id 值。就此而言，您可以像下面这样简单地迭代：

const arr = [{
    taxonomy: 'category',
    rest_base: 'categories',
    id: [1, 2]
  },
  {
    taxonomy: 'post_tag',
    rest_base: 'tags',
    id: [4, 5, 6, 7]
  }
];

const map = arr.reduce((acc, val) => {return {...acc, [val.rest_base]: val.id}}, {});
/*
{
  "categories": [
    1,
    2
  ],
  "tags": [
    4,
    5,
    6,
    7
  ]
}
*/
for (const rest_base in map) {
  for (const id of map[rest_base]) {
    console.log(`example.com/wp-json/wp/v2/${rest_base}/${id}`) 
  }
}
/*
example.com/wp-json/wp/v2/categories/1
example.com/wp-json/wp/v2/categories/2
example.com/wp-json/wp/v2/tags/4
example.com/wp-json/wp/v2/tags/5
example.com/wp-json/wp/v2/tags/6
example.com/wp-json/wp/v2/tags/7
*/

如何为每个 ID 在地图函数中获取项目

How to fetch items in a map function for each ID

javascript

arrays

wordpress-rest-api