How to use lodash locally in Quasar app?



  • Hello, i am trying to use lodash to one of project.
    How can i add this library ?

    I have installed lodash using package manager. In documentation it’s saying ->

    Example of unneeded usage of boot files
    For plain JavaScript libraries like Lodash, which don’t need any initialization prior to their usage. Lodash, for example, might make sense to use as a boot file only if you want to inject Vue prototype with it, like being able to use this.$_ inside your Vue files.
    

    So want to use it without using boot files. Any reference / sample?
    Thanks.



  • Import it like any other module.

    Scott



  • import _ from 'lodash';
    

    That’s it.

    In a page

    
    <template>
    <q-page id="folders">
        <v_entity
            ref="entity"
            vuex_module="folders"
            :route_changed="route_changed"
        >
            <!-- ROWS -->
            <template v-slot:row="row">
                <q-item-section>
                    <div class="" v-html="$younit.fuzzy_decoration(row.folder_label, $store.state.folders.search_model, true )"></div>
                </q-item-section>
            </template>
    
            <!-- EDIT PANEL -->
            <template v-slot:entity-editor-header="entity">
                {{entity.folder_label}}
                <span>#{{entity.folder_id}}</span>
            </template>
        </v_entity>
    </q-page>
    </template>
    
    <script>
    
    import _ from 'lodash';
    
    export default {
        name: 'Folders',
        data: () => {
            return {
                route_changed: {}
            };
        },
        methods: {
    
        },
        computed: {
            ...mapState('folders', ['search_model'])
        },
        beforeRouteEnter (to, from, next) {
            next(function (vm) {
                vm.route_changed = to;
                vm.$store.commit('set_active_module', 'folders');
            });
        },
        beforeRouteUpdate (to, from, next) {
            this.route_changed = to;
            next();
        },
        created () {
    
        }
    };
    </script>
    
    <style lang="stylus">
    
    </style>
    

Log in to reply