Uncaught runtime errors: teams.map is not a function with React

Working on website using reactJS and Laravel, while fetching json data from URL using map function finding this error on console :

teams.map is not a function TypeError: teams.map is not a function

API json response from URL :

{ "get": "teams", "parameters": { "name": "manchester united" }, "errors": [], "results": 1, "paging": { "current": 1, "total": 1 }, "response": [ { "team": { "id": 33, "name": "Manchester United", "code": "MUN", "country": "England", "founded": 1878, "national": false, "logo": "https://media.api-sports.io/football/teams/33.png" }, "venue": { "id": 556, "name": "Old Trafford", "address": "Sir Matt Busby Way", "city": "Manchester", "capacity": 76212, "surface": "grass", "image": "https://media.api-sports.io/football/venues/556.png" } } ] }

Getting json data like this :

`import React, { useEffect, useState } from “react”;

const TeamStats = () => {

    const [teams, setTeams] = useState([]);
  
    const getTeams = async () => {
      const response = await fetch("http://localhost:8000/home");
      const data = await response.json();
      console.log(data);
      setTeams(data);
    };
  
    useEffect(() => {
        getTeams();
    }, []);
     ....
     ....

           {teams.map(res => (
                <h4 className="text-black text-overflow">{res.response.team.name}</h4>
                ))}`

the API data calling was successful found in console.log but to display data on window error is popping again here’s my code and also attaching console output image.

enter image description here