@diwlumoprif

Каким способом можно применить метод масивов map если response обьект?

Делаю запрос к серверу

И получаю вот такой ответ от сервера(получаю обьект):
response сервера

{"data": [
    {
      "id":20, 
      "title":"people",
      "created_at":"2020-01-15 05:30:10",
      "updated_at":"2020-01-15 05:30:10"
    }
  ]
}


И я вывожу ответ в виде таблицы:

export default ({dataAttribute}) => (
  <table className="table">
    <thead>
      <tr>
        <th></th>
        <th>id</th>
        <th>title</th>
        <th>created_at</th>
        <th>updated_at</th>
      </tr>
    </thead>
    <tbody>
      {dataAttribute.map(item => (
        <tr key={item.id}>
          <td>{item.id}</td>
          <td>{item.title}</td>
          <td>{item.created_at}</td>
          <td>{item.updated_at}</td>
        </tr>
      ))}
    </tbody>
  </table>
);

И тогда у меня ошибка:
TypeError: Cannot read property 'map' of undefined
Потому что метод map можно применить только к массиву а у меня response - обьект.

И я попробовал изменить вот это:
{dataAttribute.map(item => (
На вот это:
{Object.keys(dataAttribute).map(item => (

Но все равно не могу вывести на страничку свои данные в виде таблицы, потому что ошибка.
Warning: Each child in a list should have a unique "key" prop.
Страничка есть, заголовки есть, но нет данных под заголовками:
вот так:
5ea168050d303374499323.png
Что мне исправить в коде чтобы это реализовать?
  • Вопрос задан
  • 87 просмотров
Пригласить эксперта
Ответы на вопрос 1
@crystalbit
Full Stack NodeJS PHP JS React
скорее всего dataAttribute в какие-то моменты таки null или не определен. Либо разбираться, почему - например, в момент маунта данные ещё не подгрузились, либо Object.keys(dataAttribute || {})..., if (dataAttribute) Object.keys(dataAttribute)...
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы