Как получить доступ к объектам из массива данных в ответ

Question

У меня есть следующий хук

import { useState, useEffect } from "react";
export default function FetchData(url) {
    const [data, setData] = useState([]);

    useEffect(() => {
        fetch(url)
            .then(response => response.json())
            .then(data => setData(data));
    }, []);

    return data;
}

Я вызвал этот хук, написав следующий код

const data = FetchData("https://hn.algolia.com/api/v1/search");

Предыдущий API возвращает результат с "попаданиями", которых нет непосредственно в данных

Проблема была в том, что я написал следующий код:

return (
          data.hits.map(hit =>
                    <div>{hit.title}</div>
                )

              );

Я знаю, что могу решить эту проблему, добавив "хиты" в ловушку, но я не хочу этого делать потому что мне нужен крючок, чтобы быть общим. Мне нужно манипулировать данными в вызывающей части, а не в ловушке. чтобы быть более точным c, как я могу получить доступ к данным попаданий из вызывающего контекста, а не из ловушки.

Answer 1

Попробуйте эту строку:

 return (
           data && data.hits && data.hits.map(hit => <div>{hit.title}</div>)
         );