[v1] QToolbar with Vuex doesn't seem to get updated state

[dsl101]

I have a fairly complex application, with a few levels of components, and I haven’t been able to replicate this in CodePen, so presume it’s something I’m doing. The component tree is like this:

and the Vuex state contains a setting for whether certain items in toolbar menu should be visible. It’s an object like this:

To show the issue, I’ve included the Store Getter toolbarMenu, and put these 2 lines into the relevant templates. In Default.vue (which provides the QToolbar), and Page.vue (which provides the QTabs at the bottom of the component tree), I have:

    <pre>{{toolbarMenu.select}}</pre>

To begin with, all is good:

The problem is when this state is updated via an action within QPage triggered from the QTabs @input event. I can see via devtools that the Vuex state is indeed changed (all those trues become false), and the value in QPage updates, but the value in QToolbar does not:

If I make a simple source code change when running via quasar dev, the HMR update brings the QToolbar value in line. Similarly, if I pull all this code into a single file in CodePen, it works exactly as it should. So I’m a bit stumped—what might I have done that makes this getter non-reactive in the toolbar?

[dsl101]

Dammit. Been pondering this for ages, and now having written the post, I realise I hadn’t properly initialised the properties of toolbarMenu. The fact they were working in QPage put me off the scent. Apologies for the noise.