我已向 News API 发出 GET 请求并接收了对象形式的数据。由于 map 方法只能在数组上工作，因此我将 map 用于 data.articles ，因为它是一个数组。（在第 22 行的控制台日志中检查）。

话虽如此，我不明白为什么我仍然收到

TypeError Cannot read property 'map' of undefined

https://codesandbox.io/s/elated-star-j9s8g?file=/src/App.js

function App() {
  const [apiUrl] = useState("https://gnews.io/api/v3/search?");
  const [apiKey] = useState("123456789");
  const [data, setData] = useState([]);
  const [query, setQuery] = useState("");
  const [url, setUrl] = useState(
    `https://gnews.io/api/v3/top-news?token=95e7679f627d5796aa24f6692def5df3`
  );

  useEffect(() => {
    const fetchData = async () => {
      const result = await axios(url);
      setData(result.data);
    };
    fetchData();
  }, [url]);

  const searchHandler = () => {
    setUrl(`${apiUrl}q=${query}&token=${apiKey}`);
    console.log(data.articles);
  };

  let newsNodes = data.articles.map((item) => {
    return (
      <li key={item.publishedAt}>
        <a href={item.url}>{item.title}</a>
      </li>
    );
  });

  return (
    <>
      <input
        type="text"
        value={query}
        onChange={(event) => setQuery(event.target.value)}
      />
      <button type="button" onClick={searchHandler}>
        Search
      </button>
      <ul>{newsNodes}</ul>
    </>
  );
}