Как объединить несколько фильтров в Vue.js

Question

Я хотел бы объединить некоторые фильтры в своем приложении Vue:

        app = new Vue({
            el: '#app',
            data: {
                products: null,
                productGroups: null,
                productPackageWeights: null,
                checkedProductGroupItems: [],
                checkedProductPackageWeights: [],
            },
            created: function created() {
                this.fetchData();
            },
            computed: {
                productsFilter: function () {
                    return this.filterProductGroupItems;
                }
            },        
            methods: {
                fetchData: function () {
                    var vm = this
                    axios.get([MY_JSON_FILE])
                    .then(function(response){
                        console.log(response.data.filter_data.product_package_weights);

                        vm.productPackageWeights = response.data.filter_data.product_package_weights;
                        vm.productGroups = response.data.filter_data.product_groups;
                        vm.products = response.data.products;
                    }).catch(function (error) {
                        alert('Het ophalen van de producten is niet gelukt');
                    });
                },
                filterProductGroupItems: function(data) {
                    if (this.checkedProductGroupItems.length == 0) return true;
                    return this.checkedProductGroupItems.includes(data.features.product_groups.value);
                },  
                filterProductPackageWeights: function(data) {
                    if (this.checkedProductPackageWeights.length == 0) return true;
                    return this.checkedProductPackageWeights.includes(data.features.product_package_weights);
                },                                      
            }
        });

Код работает только для filterProductGroupItems .Как объединить результаты filterProductGroupItems и filterProductPackageWeights в вычисленную функцию productsFilter ?Я также планирую сделать еще несколько функций фильтра.

Пожалуйста, помогите Спасибо!

Answer 1

вы можете сделать это

computed: {
    productsFilter: function () {
        return [...this.filterProductGroupItems(), ...this.filterProductPackageWeights()];
    }
},

или concat

computed: {
    productsFilter: function () {
        return this.filterProductGroupItems().concat(this.filterProductPackageWeights());
    }
},

проблема может заключаться в том, что вы можете получить массив, который имеет [true, Obj, Obj...] если один фильтр возвращает true, то вы можете изменить фильтр так, чтобы он возвращал пустой массив

filterProductGroupItems: function(data) {
    if (this.checkedProductGroupItems.length == 0) return [];
    return this.checkedProductGroupItems.includes(data.features.product_groups.value);
},  
filterProductPackageWeights: function(data) {
    if (this.checkedProductPackageWeights.length == 0) return [];
    return this.checkedProductPackageWeights.includes(data.features.product_package_weights);
},