我想显示基于从vue3 pinia商店获取的数据的标记。我在Map上设置第一个标记时遇到困难：

<script setup>
import { onMounted, ref } from 'vue'
import { Loader } from '@googlemaps/js-api-loader'
import { useDiscoverItemStore } from "@/stores/DiscoverItemStore"
const discoverStore = useDiscoverItemStore()

const MAPS_API_KEY = 'api-key'

const loader = new Loader({ apiKey: MAPS_API_KEY })
const mapDiv = ref(null)
let map = ref(null)

onMounted(async () => {
  await loader.load()
  map.value = new google.maps.Map(mapDiv.value, {
    center: currPos.value,
    zoom: 13,
  })

  await discoverStore.fetchItems()
  let loc = new google.maps.LatLng(discoverStore.items[0].location[0], discoverStore.items[0].location[1])

  console.log(loc)
  let marker = new google.maps.Marker({
    position: loc,
    map, // have also tried `map: map` 
    title: "Hello World!",
  })

  // have also tried `marker.setMap(map)`
})
</script>

我的控制台告诉我setMap: not an instance of Map; and not an instance of StreetViewPanorama。这是我的控制台的完整读数：

为什么我不能添加这个标记到我的谷歌Mapmapref？任何想法将不胜感激。