[Vuejs]-Quasar drawer toggle status problems

by

0👍

Few things you need to correct.

  1. In the Left Drawer component, you can’t directly use that props variable in the v-model. You need to create copy of that variable and watch that.
    props: ['leftDrawerOpen'],
    setup() {
      return {
        essentialLinks: linksList,
        drawe: ref(true)
      }
    },
    watch: {
      leftDrawerOpen: function () {
        console.log("In Watch")
        console.log(this.leftDrawerOpen)
        this.drawe = this.leftDrawerOpen
      }
    }

<q-drawer
    v-model="drawe"
    show-if-above
    bordered
  >
    <q-list>
      <q-item-label
        header
      >
        Essential Links
      </q-item-label>

    </q-list>
  </q-drawer>
  1. In header Component you are missing emits
   emits:['toggleLeftDrawer']

Leave a comment