title: Access Store Value in Vue JS
body: <p>I am importing value from store </p>
  
  <pre><code>import {store} from '../../store/store'
  </code></pre>
  
  <p>and I have Variable:-</p>
  
  <pre><code>let Data = {
    textType: '',
    textData: null
  };
  </code></pre>
  
  <p>When i use <code>console.log(store.state.testData)</code></p>
  
  <p>Getting Below result in console:-</p>
  
  <pre><code>{__ob__: Observer}
  counters:Array(4)
  testCounters:Array(0)
  __ob__:Observer {value: {…}, dep: Dep, vmCount: 0}
  get counters:ƒ reactiveGetter()
  set counters:ƒ reactiveSetter(newVal)
  get usageUnitCounters:ƒ reactiveGetter()
  set usageUnitCounters:ƒ reactiveSetter(newVal)
  __proto__:Object
  </code></pre>
  
  <p>and when i directly access <code>console.log(store.state.testData.testCounters)</code> </p>
  
  <p>Getting Below result in console:-</p>
  
  <pre><code>[__ob__: Observer]
  length:0
  __ob__:Observer {value: Array(0), dep: Dep, vmCount: 0}
  __proto__:Array
  </code></pre>
  
  <p>but if i access <code>console.log(store.state.testData.testCounters)</code> with setTimeout then i get required value for testCounters.</p>
  
  <pre><code>setTimeout(() =&gt; {
    console.log(tore.state.testData.testCounters);    
  }, 13000)
  </code></pre>
  
  <p>But i need to assign <strong>testCounter</strong>  value to <strong><em>Data</em></strong> variable but as data is not available it pass blank value as defined. How can i wait untill <strong><em>testCounters</em></strong> Data will be available or do we have any other methods?</p>
  
  <pre><code>export { Data }
  </code></pre>