Блог

У меня есть некоторый rest api, и мне нужно получить данные из promise и отобразить их.

 const data = http.get(url) // it return the promise.

// [[PromiseState]]: "fulfilled"
// [[PromiseResult]]: Array(4)
 

Я могу консольно регистрировать необходимые данные:

 const data = http.get(url).then(res=> console.log(res.data)) // array in console
 

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

 const ItemsList = () => {
  const data = http.get(url) //return promise. How can I get array from thid promise result?
  return (
      <ul>
        { data.map(item => {
          return (
            <ItemPreview key={item.id} item={item} />
          );
        })}
      </ul>
  )
}

export default ItemsList
 

пробовал async / await. потратьте уже 4 часа на это задание, но получите только ошибки. Просто не знаю, как это написать. может кто-нибудь помочь и показать мне, как это сделать. Или дайте мне ссылку, где я могу найти, как отобразить результат обещания в компоненте?

async / await это путь

 const ItemsList = async () => {
  const data = await http.get(url) 
  return (
      <ul>
        { data.map(item => {
          return (
            <ItemPreview key={item.id} item={item} />
          );
        })}
      </ul>
  )
}