Получение TypeError: news.map не является функцией. Что мне не хватает? - PullRequest
Новая
       54

Получение TypeError: news.map не является функцией. Что мне не хватает?

1 голос
/ 30 апреля 2020

Я создаю новостное приложение React, и я не знаю, почему я получаю эту ошибку "TypeError: news.map не является функцией" при попытке извлечь и отобразить данные.

Вот мой код: 

import React, {useState} from 'react';
import "./App.scss"
import axios from "axios"
import Article from "./Components/Article/Article"

function App() {

  const [news, setNews] = useState([]);

  const apiURL = "https://newsapi.org/v2/top-headlines?country=us&apiKey=287364824682742902893";

    const fetchData = async () => {
        const response = await axios.get(apiURL)

        setNews(response.data) 
        console.log(response.data)
    }

  return (
    <div className="App">

          {news.map(articles => (
            <Article title={articles.title} />
          ))} 

    </div>
  );
}

export default App;

console.log (response.data)

response.data

Ответы [ 2 ]

2 голосов
/ 30 апреля 2020

Вам нужно набрать: setNews(response.data.articles)

и позже: 

<div className="App">
        {news.map(({ author, title }, i) => (
            <div key={i}>
                <div>{author}</div>
                <div>{title}</div>
            </div>
        ))}
    </div>
2 голосов
/ 30 апреля 2020

response.data, который вы получаете, является объектом, у него нет метода сопоставления (я посетил ссылку из вашего кода, чтобы увидеть его)

предположим, что вместо этого вы должны написать setNews (response.data.someProperty), где someProperty - массив в объекте

upd: setNews (response.data.articles)

...