reactjs - 使用 api info 并将其等同于数组

Question

我有一个从 api 获取的 json 并将其作为 props 传递给子组件，我想使用 json 中的数据并循环通过 api，然后将数据设置为这样的数组：

    var myArray = [
{name : name-1, value: value-1}
{name : name-2, value: value-2}
              .
              .
              .
]

我的api是这样的：

[
{name : name-1, value:value-1, id:id-1, ... }
                     .
                     .
                     .
]

我知道如果我想返回 jsx 我必须使用“地图”但是这种情况呢？

谢谢你

Answer 1

您也可以在此处使用Array.prototype.map功能：

 var dataFromAPI = [
  {name : 'name-1', value: 'value-1', id: 1},
  {name : 'name-2', value: 'value-2', id: 2},
  {name : 'name-3', value: 'value-3', id: 3},
];

var myArray = dataFromAPI.map(function (data) {
  return {
    name: data.name,
    value: data.value
  };
});

console.log(myArray);

或使用 ES6 语法：

const dataFromAPI = [
  {name : 'name-1', value: 'value-1', id: 1},
  {name : 'name-2', value: 'value-2', id: 2},
  {name : 'name-3', value: 'value-3', id: 3},
];

const myArray = dataFromAPI.map(({name, value}) => ({ name, value }));

console.log(myArray);