[Vuejs]-How to handle multiple array filters with Vue JS?

0๐Ÿ‘

โœ…

A computed prop is what you need in this situation:

computed: {
  filteredPokemons () {
    if (this.currentType) {
      return this.allPokemon.filter(pokemon => pokemon.types[0].type.name == this.currentType)
    }
    if (this.currentGen) {
      // I assumed that a prop is named 'gen', just replace with an actual prop
      return this.allPokemon.filter(pokemon => pokemon.types[0].gen.name == this.currentGen)
    }
    // you didn't mentioned what to show when both currentType and currentGen is empty
    // I assumed it should be an empty array
    return []
  }
}

Leave a comment