Axiosライブラリの基本的な使い方

npm install axios

import axios from 'axios';

const fetchData = async () => {
  try {
    const response = await axios.get('URL');
    console.log(response.data);
  } catch (error) {
    console.error(error);
  }
};
fetchData();

import React, { useState, useEffect } from 'react';
import axios from 'axios';

export default function App() {
  const [users, setUsers] = useState([]);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState(null);

  useEffect(() => {
    const fetchUsers = async () => {
      try {
        const response = await axios.get('https://example.com/api/users');
        setUsers(response.data);
      } catch (error) {
        if (error instanceof Error) {
          setError(error.message);
        } else {
          setError('予期しないエラーが発生しました');
        }
      } finally {
        setLoading(false);
      }
    };
    fetchUsers();
  }, []);

  if (loading) return <p>読み込み中...</p>;
  if (error) return <p>エラー: {error}</p>;

  return (
    <>
      <h1>ユーザー一覧</h1>
      {users.length === 0 ? (
        <p>ユーザーはいません。</p>
      ) : (
        <ul>
          {users.map((user) => (
            <li key={user.id}>
              {user.name} ({user.email})
            </li>
          ))}
        </ul>
      )}
    </>
  );
}

npm uninstall axios