title: Vuex computed properties only work with getters
body: <p>When I put this in my Vue component ...</p>
  
  <pre><code>// using store getter
  
  computed: {
    authenticated() {
      return this.$store.getters.authenticated
    }
  }
  </code></pre>
  
  <p>... it works. The value for <code>authenticated</code> is reactive and the computed property returns <code>true</code> when the value in the vuex store is <code>true</code>.</p>
  
  <p>This should work ... (and would be the right way according to the docs)</p>
  
  <pre><code>// using store state
  
  computed: {
    authenticated() {
      return this.$store.state.authenticated
    }
  }
  </code></pre>
  
  <p>... but doesn't. The computed property is always <code>false</code>.</p>
  
  <p>It doesn't even work on initial state, so I guess it has nothing to do with the action or mutation. The vuex store holds the correct values in the <code>state</code> and the <code>getters</code> (Firefox Vue DevTools).</p>
  
  <p>My store looks like this:</p>
  
  <pre><code>const state = {
      authenticated: authenticate.isAuthenticated(),
  };
  
  const getters = {
      authenticated () {
          return state.authenticated
      }
  };
  
  const mutations = {
      isAuthenticated (state, isAuthenticated) {
          state.authenticated = isAuthenticated
      }
  };
  </code></pre>
  
  <p>So, it works with store getters but not with store state. Afaik the store state should be reactive as well.</p>
  
  <p>Any idea what I might be doing wrong?</p>