Static GitHub Issues

[2086] Feed the store with window data on application start

prev: Using ES6 features server-side
next: [Question] Nuxt way for local and social authentication

Hey there,

I am setting some values on my store based on the window width. At the moment I am doing this from my layout, with a mounted function and then also attaching a resize listener to update these. One example is setting isMobile based on the window width. Then I have components or computed properties which depend on isMobile, this works but there is a small delay because it seems that the value is assigned a bit late.

My thought was to get the window width before my application starts and then somehow pass it to the store.

I tried with a plugin like this:

export default ({store}) => { if (process.browser) { let ww = window.innerWidth store.commit('IS_MOBILE', ww < 768) } }

but I get these errors:

<img width="717" alt="vue-error" src="https://user-images.githubusercontent.com/5978397/32699429-c63a0c46-c7b5-11e7-8b98-fca14649d67d.png">

Maybe I'm thinking it in the wrong way? Any help appreciated.

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c1851">#c1851</a>)</em></sub></div>