Почему окно Fancybox пропадает сразу после появления при загрузке страницы?

Question

[photosho]

Делаю сайт на Nuxt 3. Мне нужно вызывать всплывающее окно после загрузки страницы при наличии определённого параметра в адресной строке. Использую Fancybox (@fancyapps/ui). С генерацией шаблона и вызовом окна справился, но окно, появляясь на секунду (с правильным содержимым), тут же пропадает. Думаю, дело в том, что Vue обновляет DOM и удаляет из него скрипт. Например, если вызывать этот же код в setTimeout, то окно не пропадает, но это не выход. Окно вызываю так:

export default {
  mounted() {
    this.$nextTick(() => {
      Fancybox.show([{
        src: '#myblock',
        type: 'inline'
      }]);
    });
  }
}

Как можно решить эту проблему?

Comments

[Aetae]

Судя по использованию $nextTick - этот твой #myblock не является напрямую частью компонента, в котором ты вызываешь эту функцию. Не надо так.
Для простой и очевидной работы с любыми не-vue библиотеками, лезущими в dom следует работу с ними выносить в отдельный компонент и уже с ним работать, тогда всегда можно гарантировать что при mount нужный dom элемент пояаится и будет удалён только при unmount.

Если нужно что-то более сложное - следует рассматривать каждый случай в отдельности, с пониманием того как работает vue, техношаманизм с подстановкой магических параметров и методов толку не даст.

[photosho]

Aetae, с $nextTick - это я извращался, но не работает ни с ним, ни без него. Блок находится внутри шаблона компонента, а функцию "show" вызываю в "mounted" этого же компонента.

[Aetae]

photosho, как можешь видеть здесь, даже в таком примитивном виде всё работает:

Проблема в другом месте.

Однако сразу вижу две вещи которые стоит исправить:
1. Не использовать привязку по id, а привязывать конкретный элемент - $el если корневой, $refs - если какой-то другой. В кранем случае генерировать уникальный id.
2. Добавить обработку beforeDestroy\beforeUnmount которая сделает .destroy для инстанса этого Fancybox, дабы избежать возможных оставшихся висячих концов.

[photosho]

Aetae, спасибо, да, возможно, проблема была в каком-то другом месте. Сегодня исправлял другие ошибки, а к вечеру посмотрел - окно перестало исчезать. :D Спасибо за советы.