Tal vez no entiendo lo suficientemente bien cómo funciona nuxt, pero aparentemente mis b-modals (bootstrap vue) se declaran dos veces cada vez que uso la búsqueda asíncrona en una página. Explicaré cómo está estructurado mi código (no puedo cargar todo el código debido a las políticas de la empresa):

Tengo un diseño predeterminado en la carpeta de diseños .

 <template> <div> <wrapper-navbar /> <nuxt class="body" /> <wrapper-footer /> </div> </template>

Cosas muy simples. Los contenedores se declaran en mi carpeta de componentes. El wrapper-navbar es una barra de navegación de arranque normal con modificaciones, y allí declaro un b-modal con la identificación única #login-modal que se llama cada vez que un usuario quiere iniciar sesión presionando un botón con el atributo vb-modal.login-modal . Todo funciona como se esperaba, el usuario hace clic en el botón de inicio de sesión y aparece un modal. El problema surge cuando en una página (en la carpeta de páginas ) llamo a async fetch() . En estos casos, cuando el usuario presiona el botón de inicio de sesión, el modal de inicio de sesión aparece dos veces . Me di cuenta de que en estas páginas, los métodos created() ymounted() también se llaman dos veces, así que creo que de alguna manera el modal se declara dos veces.

 // Inside pages/index.vue for example async fetch() { try { this.data = await getSomeAsyncData(); } catch (ex) { console.log(ex); } }

Esto solo sucede cuando tengo un await dentro. Si solo imprimo algo o simplemente evito usar fetch, el modal solo aparece una vez. ¿Qué estoy haciendo mal? ¿Cómo puedo evitar esto? Gracias por tus comentarios.