CODEWITHSUNDEEP
vue.jsvuejs2modal-dialognuxt.js
BT101
BT101

Reputation: 3836

Modal window in nuxt architecture

Before I was working with Vue2JS and I used to creating modal as just component within App.vue root component for example:

<template>
    <div>
        <app-navbar></app-navbar>
        <router-view></router-view>
        <app-footer></app-footer>
        <my-modal v-if="someBoolean"></my-modal>
    </div>
</template>

Now basing on some custom events or Vuex storage I was able to change someBoolean and trigger when I want modal to be visible.

Since in Nuxt we don't have such thing as root App.vue component I'm wondering how to achieve same as above but with Nuxt.

Of course I could use some package as bootstrap-vue but I don't really want to inject this big package just for that one purpose.

Upvotes: 1

Views: 5253

Answers (1)

kenanyildiz90
kenanyildiz90

Reputation: 326

You can write code in layouts/default.vue file and this file works on your defaults, work the code at where you used as a layout of your pages(generally almost everywhere.)

Different approach is use portalvue to render components whereever you want. Nice article here but in Turkish.

Upvotes: 3

Related Questions