This is one of the first google results, so here are my notes. I ran into two problems with QSplitter:

1. The UI element didn’t fill the space vertically. Setting style=“height: 100vh” had the splitter fill the vertical space w/o affecting it’s before/after children.

2. Content wasn’t expanding in the after because the height wasn’t set. Here’s my layout: QLayout -> QSplitter -> template:after -> QPageContainer -> router-view => QPage -> DivStuff + QResizeObserver -> Content

In resize, I get a ref to DivStuff, get it’s parent, get the parents “min-height”, and set DivStuff’s min-height using :style="{ ‘min-height:’: minHeight + ‘px’}"

Lastly, I set Content’s height to 99% or I get it stretches weird.

Hope this helps someone.

When I try this my eslinter complains “This assertion is unnecessary since it does not change the type of the expression.” and prettier rewrites code to remove the assertion. Any suggestions?

I’m converting a Quasar 1 JavaScript project to Quasar 2 Typescript. I’m getting a bunch of eslint errors “no-unsafe-member-access” and no-unsafe-call around this.$store.

Did you get it to work?

Thanks!

@rusia, did you find a solution?

Was there are reason that Quasar’s fullscreen api didn’t work?

Given that phaser is “inside” Quasar, using Quasar’s might be better…

Awesome! Thank you!