使用Axios获取Json并迭代ReactStrap表中的数据

npm install axios reactstrap

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

const MyComponent = () => {
  const [data, setData] = useState([]);

  useEffect(() => {
    fetchData();
  }, []);

  const fetchData = async () => {
    try {
      const response = await axios.get('https://example.com/api/data');
      setData(response.data);
    } catch (error) {
      console.error(error);
    }
  };

  return (
    <Table>
      <thead>
        <tr>
          <th>ID</th>
          <th>Name</th>
          <th>Email</th>
        </tr>
      </thead>
      <tbody>
        {data.map((item) => (
          <tr key={item.id}>
            <td>{item.id}</td>
            <td>{item.name}</td>
            <td>{item.email}</td>
          </tr>
        ))}
      </tbody>
    </Table>
  );
};

export default MyComponent;