Как создать строки для таблицы для каждого индекса массива? - PullRequest
Новая
       15

Как создать строки для таблицы для каждого индекса массива?

1 голос
/ 03 марта 2020

В настоящее время я использую реагирование. js и JSX, чтобы попытаться создать таблицу.

Дано destinations - массив объектов, и каждый объект состоит из 3 массивов строк (hikingTrails, campSites, slopes), как мне создать таблицу, в которой каждая строка состоит из строк в каждом массиве?

Например,

  • массив адресатов содержит 2 объекта.

  • Объект 1 содержит 3 массива: hikingTrails, campSites, наклоны.

  • hikingTrails массив пусто.
  • Массив campSites содержит 2 строки: Sierra, Yosemite.

  • массив наклонов empy.

  • Объект 2 содержит 3 массива: hikingTrails, campSites, склоны.

  • hikingTrails массив пуст.
  • campSites массив содержит 2 строки: XYZ, AB C.
  • массив slopes пуст.


Я хочу, чтобы таблица выглядела следующим образом:
table1

Вот что я До сих пор мы пытались: 

const allDestinations = destinations.map(destination => (
    <tr key={destination._id}>
        <td>{destination.hikingTrails}</td>
        <td>{destination.campSites}</td>
        <td>{destination.slopes}</td>
    </tr>
));

return ( 
    <Fragment>
        <table>
            <thead>
                <tbody>
                    {allDestinations} 
                </tbody>
            </thead>
        </table>
    </Fragment>
);

Но это приводит к следующей таблице:
table2

Из-за того, что campSites является массивом, destination.campSites возвращает весь массив ([0]: XYZ, 1 : AB C) как одну строку, а весь массив ([0]: Sierra, 1 : Yosemite) как другой ряд, когда я хочу, чтобы каждая строка была отдельной строкой.

Как создать строку для каждого индекса массива destination.campSites?

...