How to filter one array by another?

Asked

Viewed 1,120 times

0

I’m trying to use the filter with Vue, but I’m having trouble.

Code:

list() {
    var self=this
    const list = this.programas;
    if (_.isEmpty(this.filter)) {
        return list;
    }

    return list.filter(function(item) {
        return item.funcao.indexOf(self.filter) > -1
    })
}

It works perfectly when I step one string for the filter, but I need the filter to be an array, as I do?

This is my object: 

dsgpProgramas:[
                {  
                    'categoria': 'Entidades',
                    'funcao': 'Cadastro',
                 },
                 {
                    'categoria': 'Entidades',
                    'funcao': 'Operacao',
                }, 
                {
                    'categoria': 'Entidades',
                    'funcao': 'Consulta',
                    }, 
                {
                    'categoria': 'Entidades',
                    'funcao': 'Parametros',
                }, 
              ]

that’s my filter

filtro = ['cadastro','consulta']

only works when my filter is like this:

filtro= ['cadastro']

i.e., it only works when you filter the array through a filter with a single parameter, but in this precise example bring me the array records where the function is equal to the register or query and not just one or the other.

vue.js

  • I don’t quite understand what you want to do... from the looks of it, you have two pieces of information in your data(), being the programs and the filter, right? and want to see if the item (program) has the function? But it runs only once and gives only the first result, is that your problem? (That’s what I was able to notice)

  • I mean, it wants to keep only the functions initiated in filter? You can place the array/object programs in the question?

1 answer

3


Your problem is that the indexOf looks for the full value within the array, so how are you passing a array, it must be contained and in the same order within the program, otherwise it is filtered/removed.

This problem can be solved with one of the two examples below (there must be other ways too).

foreach

A foreach is done over the filters and is checked each one within the program functions, if any is found, the loop is broken and returned true, otherwise the loop runs to the end and returns false.

list.filter((item) => {
    self.filter.forEach((filtro) => {
        if(item.indexOf(filtro)){
            return true
        }
    }, this)

    return false
});

Lodash or _Underscore.js

For his _.isEmpty you must be using one of the two, so it is possible to do so (both are equal in this case):
The ._intersection takes all the same values among the arrays and creates a new array with these values, therefore, if they have values equal to array will not be empty and the filter will return true (because of the negation of ._isEmpty);

list.filter((item) => {
    return !_.isEmpty(_.intersection(item, self.filter));
})

Browser other questions tagged vue.js

You are not signed in. Login or sign up in order to post.