Cannot read properties of null (reading 'offsetWidth')

[jimhucksly]

Vue3 + Nuxt 3

<yandex-map  
            :settings="settings"  
             :coords="[-58.435104, -34.615689]"  
            :zoom="4"  
            :controls="['zoomControl']"  
   />

settings = {
    apiKey: '....',
    lang: 'ru_RU',
    coordorder: 'latlong',
    enterprise: false,
    version: '2.1'
  }

Uncaught TypeError: Cannot read properties of null (reading 'offsetWidth')

[eduardmavliutov]

@jimhucksly получилось решить проблему? У меня Vue 2 + Nuxt Bridge, аналогичная ошибка возникает при запуске прод-сборки, в дев-режиме все нормально.

[vserdobintsev]

В общем, тоже стал гуглить эту ошибку. Заходил к вам на огонёк, но решением выступает костыль. Нужно через v-if по-умолчанию скрывать карту, а в mounted её отображать. Вот вам коммент, который ссылкой ведёт на ответ из другого вопроса. Впрочем, код примитивный и уже по описанию всё должно быть понятно.

[elzodxon]

Actually, I imported components locally and settings as well . It works fine:)

[san8k]

это мне помогло:
<YandexMap v-if="showMap" ...>

const showMap = ref(false);
onMounted(() => {
  setTimeout(() => {
    showMap.value = true;
  }, 50);
});

[sattor1]

есть новости ? вышенаписанный код не помогает

[BoRonin]

это мне помогло: <YandexMap v-if="showMap" ...>

const showMap = ref(false);
onMounted(() => {
  setTimeout(() => {
    showMap.value = true;
  }, 50);
});

Время таймаута должно быть больше времени page transition, если он у вас есть. Т.е. карта должна грузиться после конца анимации. Либо в конфиге ставить pageTransition: false

[Amalthea-code]

Одним из основных способов решения вопроса будет это инициализация карты только на стороне клиента, всеми возможными способами. Рекомендуемый вариант обернуть в

<no-ssr>
    <div id='my-map'></div>

    <yandex-map  
            :settings="settings"  
             :coords="[-58.435104, -34.615689]"  
            :zoom="4"  
            :controls="['zoomControl']"  
   />
</no-ssr>

Причина в том что yandex maps пытается получить offsetWidth у элемента на котором он инициализируется, а offsetWidth существует только в браузере у элементов, а на стороне сервера подобные данные не возможно получить.