• Как правильно инициализировать Яндекс Карты API во Vue?

    Kozack
    @Kozack Куратор тега Vue.js
    Thinking about a11y
    Попробуйте подключать скрипт Яндекса в момент инициализации компонента. А метод yaMapInit запускать уже после того как этот скрипт загрузится.

    Дополнительно стоит предусмотреть удаление скрипта, при удалении компонента.

    Пример:
    created() { // или даже beforeCreated()
      const script = document.createElement('script')
      
      script.onload = () => {
        ymaps.ready(() => this.yaMapInit());
        // или
        // this.yaMapInit()
      };
      
      script.id = 'ymaps'
      script.src = "https://api-maps.yandex.ru/2.1/?apikey=ваш API-ключ&lang=ru_RU"
      document.head.append(script);
    },
    
    destroyed() {
    	document.head.querySelector('script#ymaps').remove()
      // ymaps = null
    }
    Ответ написан
    4 комментария