A
A
alaskafx2022-03-11 23:33:19
Yandex maps
alaskafx, 2022-03-11 23:33:19

How to solve Failed to execute 'observe' on 'MutationObserver': parameter 1 is not of type 'Node'. yandex map?

My component looks like this:

<template>
  <client-only>
    <div>
      <div v-if="needToLoad">
        <div class="objects-map row-block"></div>
        <yandex-map
          ref="myMap"
          :coords="$options.DEFAULT_COORDS"
          class="full-width"
          :zoom="$options.MAP_ZOOM"
          :scroll-zoom="false"
          @map-was-initialized="ready"
        >
        </yandex-map>
      </div>
    </div>
  </client-only>
</template>

<script>
import { loadYmap } from 'vue-yandex-maps'
const API_KEY = 'api ключ'

export default {
  name: 'YMap',
  DEFAULT_COORDS: [58.812924, 36.500804],
  MAP_ZOOM: 5,
  created () {
    this.$axios
      .get(`https://api-maps.yandex.ru/2.1?lang=en_RU&apikey=${API_KEY}`)
      .then(() => {
        this.needToLoad = true
      })
      .catch(() => {
        this.needToLoad = false
      })
  },
  data () {
    return {
      needToLoad: false,
      markers: []
    }
  },

  async mounted () {
    await loadYmap({
      apiKey: API_KEY
    })
  },

  methods: {
    ready () {
      const map = this.$refs.myMap.myMap

      map.controls.remove('rulerControl')
      map.controls.remove('geolocationControl')
      map.controls.remove('trafficControl')
      map.controls.remove('typeSelector')
      map.controls.remove('fullscreenControl')
      map.controls.remove('searchControl')
    }
  }
}
</script>

<style lang="scss" scoped>

.ymap-container {
  height: 454px;

  [class$='__toolbar'],
  [class$='__bottom'] {
    display: none;
  }
}
</style>

But when rendering, an error occurs Failed to execute 'observe' on 'MutationObserver': parameter 1 is not of type 'Node'. - how to solve it?

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question