Axios show loading dữ liệu trong khi get data

Axios show loading dữ liệu trong khi get data

import { useEffect, useState } from "react";
import reactLogo from "./assets/react.svg";
import viteLogo from "/vite.svg";
import "./App.css";
import axios from "axios";

function App() {
  const [loading, setLoading] = useState(false);
  // đầu tiên set loading là false ,khi đang đọc axios là set true, nếu chạy xong
  const [data, setData] = useState();
  async function getaxios() {
    //axios.get("https://dummyjson.com/products/1").then((response) => {
    axios.get(" https://miniapp.xxx.com/api/cauhoi").then((response) => {
      setData(response.data);
      setLoading(true);
    });
  }
  if (!data) {
    getaxios();
  }
  if (!loading) return <div>Loadding</div>;
  console.log(data);
  return (
    <>
      {data.map(function(cauhoi){
        return (
          <div>
              {cauhoi.cauhoi}
          </div>
        )
      })}
    </>
  );
}

export default App;