Отображение нескольких записей JSON в NextJS - PullRequest
Новая
       20

Отображение нескольких записей JSON в NextJS

0 голосов
/ 25 июня 2018

В уроке NextJS показано, как отобразить список имен шоу Бэтмена с карты. Загрузка шоу Бэтмена

В этом уроке есть фрагмент, который получает данные с карты: 

<ul>
  {props.shows.map(({show}) => (
    <li key={show.id}>
      <Link as={`/p/${show.id}`} href={`/post?id=${show.id}`}>
        <a>{show.name}</a>
      </Link>
    </li>
  ))}
</ul>

Но что, если документ JSON намного проще, например, 

[
 {
  "id":1,
  "text":"first doc",
 },
 {
  "id":2,
  "text":"second doc",
 }
]

Как подготовить набор данных (полученный с помощью вызова getInitialProps) и получить доступ к данным props?

С данными этого примера цель будет состоять в том, чтобы создать список значений HTML "text".

1 Ответ

0 голосов
/ 26 июня 2018

Это было не слишком очевидно для меня из документов React Списки реакций и ключи .Функция map предназначена для любого массива, который должен быть отображен.

Может отображаться любой элемент верхнего уровня записи JSON. 

  <ul>
  {props.mydata.map(({id, text}) => (
    <li key={id}>
      <Link as={`/p/${id}`} href={`/post?id=${id}`}>
        <a>{text}</a>
      </Link>
    </li>
  ))}
</ul>
...