getters.vue

<template>
    <div>
        <p> Counter value is: {{ counter }} </p>
        <p> Counter incremental value is: {{ increment }} </p>
    </div>
</template>

<script>
    import {
        mapGetters
    } from 'vuex';
    
    export default {
        name: 'appResult',
    
        /**
         * map the method(s) in getters to a property
         */
        // computed: mapGetters({
        //     counter: 'addCurrencyToCounter',
        //     increment: 'incrementCounterByTen'
        // })
    
        /**
         * **** using spread operator ****
         * This is useful when other properties are to be 
         * added to computed proptery
         */
        computed: {
            ...mapGetters({
                counter: 'addCurrencyToCounter',
                increment: 'incrementCounterByTen'
            })
        }
    }
</script>