Где можно посмотреть пример кода компонента React взаимодействующий с API? Доброго времени суток. Изучаю связку React - Redux, хотелось бы посмотреть пример простого компонента, который бы взаимодействовал с каким то API. Скиньте, пожалуйста, такой пример.
В данном примере компонент ApiComponent делает запрос к API по адресу https://jsonplaceholder.typicode.com/posts при загрузке страницы, получает список постов и отображает их заголовки в виде списка. При этом используется библиотека axios для выполнения HTTP запросов.
Конечно, вот пример простого компонента React, который взаимодействует с API:
import React, { useState, useEffect } from 'react';import axios from 'axios';
const ApiComponent = () => {
const [data, setData] = useState(null);
useEffect(() => {
const fetchData = async () => {
try {
const response = await axios.get('https://jsonplaceholder.typicode.com/posts');
setData(response.data);
} catch (error) {
console.error('Error fetching data: ', error);
}
};
fetchData();
}, []);
return (
<div>
<h1>API Data:</h1>
{data ? (
<ul>
{data.map((post) => (
<li key={post.id}>{post.title}</li>
))}
</ul>
) : (
<p>Loading data...</p>
)}
</div>
);
};
export default ApiComponent;
В данном примере компонент ApiComponent делает запрос к API по адресу https://jsonplaceholder.typicode.com/posts при загрузке страницы, получает список постов и отображает их заголовки в виде списка. При этом используется библиотека axios для выполнения HTTP запросов.