How can I access my localstorage data without the need for refresh

[markbruk]

I have a standard Quasar project from "create" with layouts/MainLayout.vue, pages/Index.vue. Those are the only two files I have altered after the Quasar CLI create process.

In MainLayout.vue I store some data in localStorage, ex.
this.$q.localStorage.set('curriculumId', 0)

In Index.vue when I try to get this item, ex.
var s = this.$q.localStorage.getItem('curriculumId')

I get null as a response

If I try to do get this data in mounted() (and I have tried in all other lifecycle hooks), I again get null, ex.

if (this.$q.localStorage.has('curriculumId')) {
console.log('mounted - success')
} else {
console.log('mounted - failed')
}

CONSOLE
mounted - failed

However, when I hit refresh, all of my data is available.

My routes.js is system created
const routes = [
{
path: '/',
component: () => import('layouts/MainLayout.vue'),
children: [
{ path: '', component: () => import('pages/Index.vue') }
]
},

// Always leave this as last one,
// but you can also remove it
{
path: '*',
component: () => import('pages/Error404.vue')
}
]