title: How to access store values to components in vue js
body: <p>This is my store.js</p>
  
  <pre><code>import Vue from 'vue'
  import Vuex from 'vuex'
  
  Vue.use(Vuex)
  
  export default new Vuex.Store({
      state: {
          isLoggedIn: !!localStorage.getItem('token'),
          isLog : !!localStorage.getItem('situation')
      },
      mutations: {
          loginUser (state) {
              state.isLoggedIn = true
              state.isLog = true
          },
          logoutUser (state) {
              state.isLoggedIn = false
              state.isLog = false
          },
      }
  })
  </code></pre>
  
  <p>but when I call {{state.isLoggedIn}} in the display.vue, I am not getting the values.</p>
  
  <p>In display.vue, I use</p>
  
  <pre><code>&lt;script&gt;
  import axios from "axios";
  import store from '../store';
  
  export default {
    name: "BookList",
    data() {
      return {
        students: [],
        errors: [],
        state: this.state.isLoggedIn,
  
      };
    },
  })
  &lt;/script&gt;
  
  &lt;template&gt;
  {{this.state}}
  &lt;/template&gt;
  </code></pre>
  
  <p>But I am getting errors when i done this way. Please can anyone please help what is the problem.</p>