vuex-no-map

    1.0.11 • Public • Published

    vuex-no-map

    npm npm

    This plugin allows to omit using mapState, mapGetters, mapMutations, mapActions And thus reduce amount of code.

    For example, instead of writing this code (consider having counter store module):

    <template>
        <div>{{ count }}</div>
        <div>{{ getFormattedCount }}</div>
        <button @click="INCREMENT">+</button>
        <button @click="DECREMENT">-</button>
        <button @click="callApi">call</button>
    </template>
     
    <script>
    import { mapState, mapGetters, mapMutations, mapActions } from 'vuex';
     
    export default {
        name: 'TestComponent',
        computed: {
            ...mapState('counter', ['count']),
            ...mapGetters('counter', ['getFormattedCount'])
        },
        methods: {
            ...mapMutations('counter', ['INCREMENT', 'DECREMENT']),
            ...mapActions('counter', ['callApi'])
        }
    }
    </script>

    We could write this:

    <template>
        <div>{{ counter_count }}</div>
        <div>{{ counter_getFormattedCount }}</div>
        <button @click="counter_INCREMENT">+</button>
        <button @click="counter_DECREMENT">-</button>
        <button @click="counter_callApi">call</button>
    </template>
     
    <script>
    export default {
        name: 'TestComponent'
    }
    </script>

    Usage:

    import Vue from 'vue';
    import Vuex from 'vuex';
    import VuexNoMap from 'vuex-no-map';
     
    const store = new Vuex.Store({
        // store options here
    });
     
    Vue.use(VuexNoMap, { Vuex, store });

    Install

    npm i vuex-no-map

    DownloadsWeekly Downloads

    0

    Version

    1.0.11

    License

    ISC

    Unpacked Size

    4.01 kB

    Total Files

    3

    Last publish

    Collaborators

    • p1pchenk0