Отображение и объект, заполненный объектами React.js / JS - PullRequest
Новая
       24

Отображение и объект, заполненный объектами React.js / JS

0 голосов
/ 25 октября 2018

Итак, у меня есть массив, в котором есть один объект, но внутри этого объекта может быть 3 или более объектов.Это почти точный формат API, из которого я вызываю его (причина в том, что длина имеет такие числа, потому что я использую параметры в вызове API.): 

[
  {
    0: {
      0: {
        num: 1,
        name: 'franklin',
      },
      1: {
        num: 58,
        name: 'harold',
      },
      8: {
        num: 9,
        name: 'eugene',
      },
      19: {
        num: 5,
        name: 'clive',
      },
    }
  }
]

Я пытаюсьциклически проходить через каждый из 0, 1, 8 и 19, чтобы извлечь из них данные и отобразить их в таблице.Каждый раз, когда я пробую, он отображает только первый, но не другой 3.

Я только что сделал типичное: 

myApi.map((people, i) => {
  let row = <tr>{people[i].num}</tr><tr>{people[i].name}</tr>
  tableRow.push(row);
})

, но, как я уже сказал, тогда отображается только первоечасть данных, а не другая 3. Куда я иду не так?

Ответы [ 2 ]

0 голосов
/ 25 октября 2018

Вам нужно перебрать объект внутри вашего массива. 

myApi.map((people) => {
  for(var person in people) {
  let row = <tr>{people[person].num}</tr><tr>{people[person].name}</tr>
  tableRow.push(row);
 }
})

Что-то подобное, я верю.

0 голосов
/ 25 октября 2018

map на самом деле не подходит в этом случае, если вы просто повторяете и помещаете объекты в отдельный массив.Также обратите внимание, что то, что вы опубликовали, не является массивом;это объект.

Чтобы перебрать значения объекта, вы можете использовать Object.values и простой forEach: 

let myApi = [{
  0: {
    0: {
      num: 1,
      name: 'franklin',
    },
    1: {
      num: 58,
      name: 'harold',
    },
    8: {
      num: 9,
      name: 'eugene',
    },
    19: {
      num: 5,
      name: 'clive',
    },
  },
  1: {
    20: {
      num: 6,
      name: 'bob',
    },
  }
}];

let tableRows = [];
Object.values(myApi[0]).forEach(collection => {
  Object.values(collection).forEach(person => {
    tableRows.push('Name is ' + person.name + '; num is ' + person.num);
  });
});

console.log(tableRows);
...