[Vuejs]-Dynamically accessing vuex data in v-for

1👍

Try to use a method getState as follows :

<template>
    <div v-for="(item, index) in items">
        {{item.id}}: {{getState(item.value)}}<br>        
    </div>
</template>
<script>
    export default {
        name: "test",
        data: () => ({
            items: [
                {id: 'item1', value: "countingDice"},
                {id: 'item2', value: "otherValue"},
            ],
        }),
        computed: {
            ...mapState("countingDice"),
            ...mapGetters("otherValue"),
        },
     methods:{
       getState(val){
      return this[val]; // this returns the computed property with val as name
      }
     }
    }
</script>

Leave a comment