Не удается отобразить данные из вызова API в React с использованием Axios

Question

Я пытаюсь получить данные из вызова API и отобразить их в ответ. Часть hooks работает правильно, но возникают проблемы с анализом ответа json. Я получаю data.map не является ошибкой функции. Любой совет, чтобы получить эту работу будет принята с благодарностью.

Вот ответ API

{"Field1":"XXX","Field2":"YYY","Field3":"ZZZ"}

А вот код:

const [data, setData] = useState([]);

useEffect(() => {
const fetchData = async () => {
  const response = await axios(
    "http://www.myapi.com/?&search=mykeyword"
  );

  setData(response.data);
};
fetchData();
}, []);

return (
<div>
  <ul>
    {data.map(item => (
      <div key={item.Field1}>
        <div>{item.Field2}</div>
      </div>
    ))}
  </ul>
</div>
 );
}