How to load page or components in Qdialog?



  • Is there any way to load or render components into Qdialog? Please I need to know if it is possible and if any example/sample of such methods is available

    A scenario.

    <q-toolbar>
       <q-select v-model="event" :option="eventtype" @input="onEventChange()" label="Select Event" />
    </q-toolbar>
    
    <q-dialog>
    
    </q-dialog>
    

    And in the script,

    <script>
    import eventList from 'statics/data/event.json'
    
    export default {
        data () {
             return {
                 event: null,
                 dialog: false,
                 app: {
                    title: ' '
                    url: ' '
             }
       },
     computed: {
         eventtype () {
             return eventList
        }
    },
    methods: {
      onEventChange () {
        if (this.event === "New Entry" {
           this.app.title = 'New Entry Form'
           this.app.url = 'components/forms/newEntryForm.Vue'
    } else  if (this.event === "Edit Entry" {
          this.app.title = 'Edit User details'
          this.app.url = 'components/forms/editForm.Vue'
    }
    
    }
    </script>
    

    Question
    How can I use Qdialog to load either newEntryForm.vue or editForm.vue depending on event selected by the user?


Log in to reply