@danilr

Как правильно написать фильтр?

Помогите написать фильтр, который работает так - есть массив с фильтрами, которым должны соответствовать отобранные объекты. activeFilter = ['display', 'water', 'gps']
Массив состоит из объектов, в котором есть флаги по которым нужно фильтровать:
{
 disColor : true,
  water : false,
 gps : true
}

Фильтр должен быть независимым, то есть если хоть один из флагов true, то включать его в результат.
Помогите написать такой алгоритм
  • Вопрос задан
  • 165 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега Vue.js
Добавим в компонент описание фильтров. Это будет массив объектов, содержащих два свойства: имя (совпадает с именем свойства в элементах фильтруемого массива) и активность (указывает, надо ли применять это фильтр):

data: () => ({
  filters: [
    { name: 'disColor', active: true },
    { name:    'water', active: true },
    { name:      'gps', active: true },
  ],
  ...

На основе этого описания создадим элементы управления, чтобы пользователь мог переключать активность фильтров:

<label v-for="f in filters">
  <input type="checkbox" v-model="f.active">
  {{ f.name }}
</label>

Наконец, применим фильтры - сделаем вычисляемое свойство, которое будет представлять отфильтрованные данные:

computed: {
  filteredItems() {
    const filters = this.filters.filter(n => n.active);
    return this.items.filter(n => filters.some(f => n[f.name]));
  },
  ...

https://jsfiddle.net/276xgmho/
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы