Function mapState

Allows using state and getters from one store without using the composition API (setup()) by generating an object to be spread in the computed field of a component. The values of the object are the state properties/getters while the keys are the names of the resulting computed properties. Optionally, you can also pass a custom function that will receive the store as its first argument. Note that while it has access to the component instance via this, it won't be typed.

Example

export default {
  computed: {
    // other computed properties
    // useCounterStore has a state property named `count` and a getter `double`
    ...mapState(useCounterStore, {
      n: 'count',
      triple: store => store.n * 3,
      // note we can't use an arrow function if we want to use `this`
      custom(store) {
        return this.someComponentValue + store.n
      },
      doubleN: 'double'
    })
  },

  created() {
    this.n // 2
    this.doubleN // 4
  }
}
Copy

Allows using state and getters from one store without using the composition API (setup()) by generating an object to be spread in the computed field of a component.

Example

export default {
  computed: {
    // other computed properties
    ...mapState(useCounterStore, ['count', 'double'])
  },

  created() {
    this.count // 2
    this.double // 4
  }
}
Copy