小编Thi*_*wes的帖子

Vue 3 中的高级MarkerView

使用 Google 地图时,AdvancedMarkerView地图上不显示。googleMap仅当存储在组件中时才会出现此问题。当存储googleMap在 const 或 window 对象中时,它工作正常。

我想将其存储在组件中,以便稍后添加或删除标记。我错过了什么还是因为它AdvancedMarkerView是测试版?

mounted() {
    const loader = new Loader({
        apiKey: 'key',
        version: 'beta',
        libraries: ['marker'],
    });

    loader.load().then((google) => {
        this.googleMap = new google.maps.Map(this.$refs.map, this.mapOptions);
        // const googleMap = new google.maps.Map(this.$refs.map, this.mapOptions);
        // window.googleMap = new google.maps.Map(this.$refs.map, this.mapOptions);

        // Marker works fine
        new google.maps.Marker({
            map: this.googleMap,
            position: this.home.position,
        })

        // Works only with window.googleMap or const googleMap
        new google.maps.marker.AdvancedMarkerView({
            map: this.googleMap,
            position: this.home.position,
            content: this.buildContent(this.home),
            title: this.home.title …
Run Code Online (Sandbox Code Playgroud)

google-maps-markers vuejs3 google-maps-advanced-marker-element

2
推荐指数
1
解决办法
1967
查看次数