Adding and opening right drawer with specific component or view

  • I wanted to show right drawer for just two views or within two components in the entire app on a button click and the content are coming from those components only (some dynamic content).
    Can I achieve something like this without adding right drawer slot in my main q-layout component?

      <div class="layout-padding">
        <!-- code for quasar drawer which I couldn't figure out without q-layout! -->
        <q-btn flat v-for="item in myList" @click="openSuggestions(myList[item].suggestions)">
          {{item}} Suggestions
    import { QBtn } from 'quasar'
    export default {
      components: {
      data () {
        return {
          myList: {
            name: { suggestions: ['related link 1', 'related link 2', 'related link 3'] }
            company: { suggestions: ['related link 4', 'related link 5'] }
      methods: {
        openSuggestions: function (list) {
          // Pass list to right drawer
          // Open right drawer

    Thanks in advance for any suggestions. Above code is just a snippet I typed here from my component so may have some typo or syntax issues.

Log in to reply