title: Accessing Vuex state when defining Vue-Router routes
body: <p>I have the following Vuex store (main.js):</p>
  <pre class="lang-js prettyprint-override"><code>import Vue from 'vue'
  import Vuex from 'vuex'
  
  Vue.use(Vuex)
  
  //init store
  const store = new Vuex.Store({
      state: {
          globalError: '',
          user: {
              authenticated: false
          }
       },
       mutations: {
           setGlobalError (state, error) {
               state.globalError = error
           }
       }
  })
  
  //init app
  const app = new Vue({
      router: Router,
      store,
      template: '&lt;app&gt;&lt;/app&gt;',
      components: { App }
  }).$mount('#app')
  </code></pre>
  <p>I also have the following routes defined for Vue Router (routes.js):</p>
  <pre class="lang-js prettyprint-override"><code>import Vue from 'vue'
  import VueRouter from 'vue-router'
  
  Vue.use(VueRouter)
  
  //define routes
  const routes = [
      { path: '/home', name: 'Home', component: Home },
      { path: '/login', name: 'Login', component: Login },
      { path: '/secret', name: 'Secret', component: SecretPage, meta: { requiresLogin: true }
  ]
  </code></pre>
  <p>I'm trying to make it so that, if Vuex stores the <code>user</code> object, and it has the <code>authenticated</code> property set to <code>false</code>, is has the router redirect the user to the login page.</p>
  <p>I have this:</p>
  <pre class="lang-js prettyprint-override"><code>Router.beforeEach((to, from, next) =&gt; {
      if (to.matched.some(record =&gt; record.meta.requiresLogin) &amp;&amp; ???) {
          // set Vuex state's globalError, then redirect
          next(&quot;/Login&quot;)
      } else {
          next()
      }
  })
  </code></pre>
  <p>The problem is I don't know how to access the Vuex store's <code>user</code> object from inside the <code>beforeEach</code> function.</p>
  <p>I know that I can have the router guard logic inside components using <code>BeforeRouteEnter</code>, but that would clutter up each component. I want to define it centrally at the router level instead.</p>