reactjs-无法将来自 API 的数据映射到 React 中的渲染组件

我需要为我的 axios.get 返回的每个位置渲染一个传单标记（它返回一个对象数组，每个对象都是一个位置）但是当我尝试这样做时出现两个错误：

-“未捕获的类型错误：data.map 不是函数”；-“警告：无法对尚未安装的组件执行 React 状态更新。这表明您的渲染函数中有副作用，该函数稍后会异步调用尝试更新组件。将此工作移至 useEffect反而”。

我已经用本地样本对其进行了测试，并且可以正常工作。问题是让它使用从 Promise 中检索到的数据。

import { useState } from "react"
import { MapContainer, TileLayer, Marker, Popup } from 'react-leaflet'
import { Link } from "react-router-dom"
import axios from "axios"

import "../styles/Map.css"

export default function Map() {
    const [data, setData] = useState({})

    async function getData() {
        await axios.get("http://localhost:8080")
            .then(data => data.json())
            .then(data => setData(data))
            .catch(data => data = "")
    }

    getData()
    
    return (

    )
}