0

Estou tentando usar o filtro com o vue, mas estou tendo dificuldade.

Código:

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
    })
}

Funciona perfeitamente quando passo uma string para o filter, porém preciso que o filtro seja um array, como faço?


Esse é meu objeto:

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

esse é meu filtro

filtro = ['cadastro','consulta']

só funciona quando meu filtro é assim:

filtro= ['cadastro']

ou seja ele só funciona quando filtro o array por um filtro com um único parametro, mas nesse exemplo preciso que me traga os registros do array onde a função seja igual ao cadastro ou consulta e não apenas um ou outro.

2
  • Não entendi muito bem o que quer fazer... Pelo que parece, você tem duas informações no seu data(), sendo eles o programas e o filter, certo? e quer ver se o item (programa) tem a função? Porém ele executa apenas uma vez ejá dá apenas o primeiro resultado, é esse seu problema? (foi o que consegui perceber)
    – Pliavi
    7/02/2017 às 14:38
  • Digo, quer manter apenas as funções iniciadas em filter? Pode colocar a array/objeto programas na pergunta?
    – Pliavi
    7/02/2017 às 14:48

1 Resposta 1

3

O seu problema é que o indexOf procura o valor por completo dentro da array, então como você está passando uma array, a mesma deve estar contida e na mesma ordem dentro do programa, caso contrário é filtrada/removida.

Esse problema pode ser resolvido com um dos dois exemplos abaixo (devem existir outras formas também).

forEach

Um foreach é feito sobre os filtros e é verificado cada um dentro das funções do programa, caso alguma seja encontrada, o laço é quebrado e retornado true, caso contrário o laço roda até o fim e retorna false.

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

    return false
});

Lodash ou _Underscore.js

Pelo seu _.isEmpty você deve estar usando um dos dois, então é possível fazer assim (ambos são iguais nesse caso):
O ._intersection pega todos os valores iguais entre as arrays e cria uma nova array com esses valores, logo, se tiverem valores iguais a array não estará vazia e o filtro retornará true (por conta da negação do ._isEmpty);

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

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .