Как отобразить вложенный массив объектов в React - PullRequest
Новая
       22

Как отобразить вложенный массив объектов в React

0 голосов
/ 08 мая 2019

Я пытаюсь отобразить массив, и для каждого ключа отобразить вложенный массив объектов для распечатки сгруппированных значений.

Я продолжаю получать .map () не является функцией для моеговложенные массивы.

Я пытался использовать Object.Keys для объектов и map () для массивов, но мне кажется, что я ничего не могу напечатать правильно.

Сгруппированный массив 

{Airport: Array(1), Motorway: Array(2), Other: Array(2), Train: Array(2), Subway: Array(1)}

Вложенные массивы 

 Airport: Array(1)
  0: {Station: "Airport", Description: "This is a description for the Airport", …}

 Motorway: (2) [{…}, {…}]

Попытка распечатать сопоставленные результаты: 

 return (
    <Wrapper>
        {Object.keys(list).map((key) => {
            key.map((station) => {
                console.log(station);
            })
        })}
    </Wrapper>
)

Я думал, что родительский объект - это объект, а дочерние элементы - это массивы, что ключи объектатогда функция map будет работать, но она выдает .map () не является ошибкой функции.Любая помощь будет принята с благодарностью.

1 Ответ

2 голосов
/ 08 мая 2019

Причина, по которой это не работает, заключается в том, что вы пытаетесь сделать .map в key.key - это просто строка.

Вы должны выполнить сопоставление с list[key], который является массивом 

    {Object.keys(list).map((key) => {
        return list[key].map((station) => {
            console.log(station);
            // you should return something here
        })
    })}

Еще одна вещь, которую вы можете сделать, это перебрать значения.

    {Object.values(list).map((value) => {
        return value.map((station) => {
            console.log(station);
            // you should return something here
        })
    })}

Таким образом, values - это нужный массив, и вы можете использовать .map.

...