This example fetches data from a public API and displays it.
jsxCopy codeimport React, { useEffect, useState } from 'react';
import ReactDOM from 'react-dom';
function UserList() {
const [users, setUsers] = useState([]);
const [loading, setLoading] = useState(true);
useEffect(() => {
const fetchUsers = async () => {
const response = await fetch('https://jsonplaceholder.typicode.com/users');
const data = await response.json();
setUsers(data);
setLoading(false);
};
fetchUsers();
}, []);
if (loading) return <div>Loading...</div>;
return (
<div>
<h1>User List</h1>
<ul>
{users.map(user => (
<li key={user.id}>{user.name} - {user.email}</li>
))}
</ul>
</div>
);
}
ReactDOM.render(<UserList />, document.getElementById('root'));
Leave a Reply