Я хочу создать динамические карты начальной загрузки, используя данные JSON в ReactJS

Question

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

это тот JSON, который у меня есть *

[
{
"albumId": 1,
"id": 1,
"title": "accusamus beatae ad facilis cum similique qui sunt",
"url": "https://via.placeholder.com/600/92c952",
"thumbnailUrl": "https://via.placeholder.com/150/92c952"
},
{
"albumId": 1,
"id": 2,
"title": "reprehenderit est deserunt velit ipsam",
"url": "https://via.placeholder.com/600/771796",
"thumbnailUrl": "https://via.placeholder.com/150/771796"
 },
 {
"albumId": 1,
"id": 3,
"title": "officia porro iure quia iusto qui ipsa ut modi",
"url": "https://via.placeholder.com/600/24f355",
"thumbnailUrl": "https://via.placeholder.com/150/24f355"
 },
 {
"albumId": 1,
"id": 4,
"title": "culpa odio esse rerum omnis laboriosam voluptate repudiandae",
"url": "https://via.placeholder.com/600/d32776",
"thumbnailUrl": "https://via.placeholder.com/150/d32776"
 },
 {
"albumId": 1,
"id": 5,
"title": "natus nisi omnis corporis facere molestiae rerum in",
"url": "https://via.placeholder.com/600/f66b97",
"thumbnailUrl": "https://via.placeholder.com/150/f66b97"
 },
 ]

Answer 1

Я думаю, что основная идея состоит в том, чтобы иметь компонент карты, который принимает реквизиты, и, перебирая массив, полученный из файла json, вы передаете эти реквизиты компоненту.

   { this.albums.map(album => <Card key={album.id} album={album} />) }