[Vuejs]-Vue-tables-2 filtering arguments passed from parent component

by

0👍

✅

With trying to keep all the logic client-side I think I’m going to create a layer between the raw table data and the vue-table and apply my logic in there as a computed function.

edit- it worked.

Here’s what I did for the computed part

computed: {
        searchRows: function () {
            var filteredRows = this.rows;
            var term = this.searchTerm;
            if(this.searchTerm) {
                filteredRows = [];
                this.rows.forEach(function(entry) {
                    if(String(entry.id).includes(term) || String(entry.name).includes(term)) {
                        filteredRows.push(entry);
                    }
                });
            }
            return filteredRows;
        }
    },

I linked the data on the table to the computed call.

<v-client-table :columns="columns" :data="searchRows" :options="options">

Only downside I can see is that if the table gets large enough it could cause a problem because now I’m storing up to 2 copies of it in memory.

Leave a comment