toggleLeft (or close) only when on phone?

  • My web app works fine, but I am having some trouble with the iphone version, the drawer won’t close. I suspect this is because I replaced my <q-side-link to= elements with a function

    <q-item @click="gotointernal('/dashboard','Dashboard')">:

    gotointernal (url, bigname) {
      this.routeName = bigname

    I could add a toggleLeft to that function, but I want the sidebar to stay open if on desktop, and only close if on a small device. Any idea how I can do one of the following:

    1. Fix the drawer so it works properly again on ios (but without reverting to q-side-link)
    2. Detect open/close state of drawer
    3. Only close drawer if on iphone/android, not on desktop


  • The more I look at this, the stranger it is. Can anyone explain to me why my method code above (that replaces q-side-link) would fail to hide the drawer when run (via cordova) on ios, but using q-side-link DOES properly hide the drawer and return control to the page?

  • This post is deleted!

  • Well, I found a workaround that hopefully helps someone else. I can attach a method separately by using @click.native=“mymethod()” in q-side-link.

  • How did you fix this ssuess?

  • I had some issues when closing drawer and navigating in the same method:

    // wrong way
    // right way
    this.layout.hideLeft(() => {

    Hope this helps

  • @trsiddiqui1989 exactly as I said above. Create a method that does what you want and attach it to @click.native in your q-side-link component. If you have a question about that, please let me know with specifics and I will try to answer in greater detail, hope this helps.

  • The problem is, hideLeft is not working on the side bar which comes with an overlay.

Log in to reply