Quasar: visibilty of q-layout-drawer doesnt work after reload if :overlay=true is set.

Created on 24 Apr 2018  路  11Comments  路  Source: quasarframework/quasar

if i use the q-layout-drawer with the visibility control by the v-model (false / true) it
works fine .. also with reload.

If i add the :overlay="true" option the visibilty control by the v-model is not working
after the reload ... (set to true, reload ... no drawer occurs.)

this problem is also at some other users (maiko, ..) we discorded this :-)

Quasar: 0.15.10
-> all browsers

v-model="leftDrawerOpen"
:content-class="$q.theme === 'mat' ? 'bg-grey-2' : null"
:overlay="true"
side="left"
>

Most helpful comment

as issuer opener i give a big "Thank you" for optimizing this behaviour ..

All 11 comments

Please create a fiddle so we can test the problem.

hi pdanpdan,

i tried to simulate this on a jsfiddle, but the problem is, to show this reload issue - the fiddle framework is capturing the reload - so i cannot give you a fiddle.

for you, to simulate this issue : add the :overlay="true" and make a v-model true this will be a 20 second simulation ...

if this works on your test enviroement - myself and all other issued-users can forget this issue ..

sorry for this ..

Ah, I got it. This is so by design. If you need you can set model to true with a small delay in mounted ($nextTick should be enough I think).

added a $nextTick delay with the open instruction inside the mounted events and the drawer is still closed after the reload.

may you have a example ?

Please make a jsfiddle so I can check your code.

@pdanpdan I think this is unexpected behaviour and undesired, I understand why this is the case now that you mention it, but it's too opinionated and not intuitive as to what the documentation infers. For instance, I have a menu that needs to be visible at all times. It is set to be visible with :value='true', which is intuitive since I don't want it controlled by any prop, then it should show as expected. And having the drawer then hide by default because of overlay and without knowledge of the developer is actually a nightmare to say the least. At least this should appear in the documentation. But the correct thing would just do what it should do, just as what developers expect, show up when asked to show up regardless of when, as the documentation says. I thought v-model and value primarily control it's visibility in addition to breakpoint, behavior, and persistent props, not overlay, this property should just tell the drawer to be above things and not meddle with visibility. Otherwise someone spends hours hunting a bug that's not even in their code and then somehow ends up in Quasar Github to only find out that it is by an undocumented design principle. 馃槄

It then becomes a really headache bug when you reload. Whoaaaa! where did it go? I am using version 1.0.0-rc-4.

Please upgrade to latest Quasar (v1.0.5 atm)

I keep explaining this over and over again why the default state needs to go to hidden...
Reopening to give it another go. There's lots of scenarios that need to be taken into account and very smart solutions needed for some. Will keep you all updated on the progress.

QDrawer will no longer tamper with the v-model, but this means to take into account to initialize the v-model correctly (usually model: this.$q.screen.width >= 992, where you replace 992 by your drawer breakpoint --- 992 is the default one)

This change will be available in 1.1.0.

as issuer opener i give a big "Thank you" for optimizing this behaviour ..

Was this page helpful?
0 / 5 - 0 ratings