[Vuejs]-Vue: Best Vuex practice for having a component that relies on Vuex store property

1👍

You could use mapState of Vuex and spread it in computed property of the component to get the state directly. Considering that you have a currentProduct state in your store…

<template>
  <div>
    <div>{{ currentProduct.title }}</div>
    <div>{{ currentProduct.name }}</div>
  </div>
</template>


<script>
import { mapState } from 'vuex';

export default {
  ...
  computed: {
    ...mapState(['currentProduct']).
  }
}
</script>

Just use getters if you want to transform some data from your state. https://vuex.vuejs.org/guide/getters.html

Leave a comment