title: What is the correct way to use component props in a Vuex getter?
body: <p>Assume you have a simple app component with a button to add multiple counters from a counter component using a vuex store.</p>
  
  <p><a href="http://www.webpackbin.com/NkgzMe8Db" rel="nofollow">Here is the whole thing on webpackbin.</a> </p>
  
  <p>A bit like the basic counter example from the <a href="https://github.com/vuejs/vuex/tree/master/examples/counter" rel="nofollow">vuex git repo</a>.But you want to use the vuex getter with an ID that is handed over via a property on the component, how would you do that?</p>
  
  <p>The getter has to be a pure function, so you can't use <code>this.counterId</code>. The official docs say you have to use a computed property, but that doesn't seem to work either. This code returns undefined for the getter:</p>
  
  <pre><code>import * as actions from './actions'
  
  export default {
      props: ['counterId'],
      vuex: {
          getters: {
              count: state =&gt; state.counters[getId]
          },
          actions: actions
      },
      computed: {
          getId() { return this.counterId }
      },
  }
  </code></pre>