Фильтрация массива в зависимости от нескольких условий флажка - PullRequest
1 голос
/ 25 октября 2019

Я создаю сайт недвижимости , где пользователи могут применять фильтры. Один из фильтров, который я хочу установить, состоит в том, есть ли в собственности балкон, терраса на крыше и сад .

Поэтому, когда у меня установлен только один флажок (балкон), я хочу показать всесвойства с балконами. Но когда у меня установлены два флажка (например, сад и балкон), я хочу отобразить только свойства с этими специфическими качествами, которые имеют сад и балкон.

У меня есть довольно сложное и сложное решение. В настоящее время у меня есть только 3 флажка, но что если я добавлю еще 5? Код станет очень неэффективным, и все должно быть закодировано снова.

Вот мое «сложное» решение:

var filters = {
 balcony: false,
 garden: false,
 roofTerrace: false
};

const checkboxFilter = plotAreaFilter.filter((item) => {
    // If only Balcony is checked
    if (filters.balcony && !filters.roofTerrace & !filters.garden) {
        if (item.balcony) {
            return true
        }
    }
    // If both Balcony and Roof Terrace is checked
    else if (filters.balcony && filters.roofTerrace & !filters.garden) {
        if (item.balcony && item.roofTerrace) {
            return true
        }
    }
    // If all three Balcony, Roof Terrace and Garden is checked
    else if (filters.balcony && filters.roofTerrace & filters.garden) {
        if (item.balcony && item.roofTerrace && item.garden) {
            return true
        }
    }
    // If only Roof Terrace is checked 
    else if (!filters.balcony && filters.roofTerrace & !filters.garden) {
        if (item.roofTerrace) {
            return true
        }
    }
    // If only Garden is checked
    else if (!filters.balcony && !filters.roofTerrace & filters.garden) {
        if (item.garden) {
            return true
        }
    }

    // If both Roof Terrace and Garden is checked
    else if (!filters.balcony && filters.roofTerrace & filters.garden) {
        if (item.roofTerrace && item.garden) {
            return true
        }
    }

    // If only Balcony and Garden is checked 
    else if (filters.balcony && !filters.roofTerrace & filters.garden) {
        if (item.balcony && item.garden) {
            return true
        }
    } else {
        return true
    }
})
return checkboxFilter;

Я действительно надеюсь, что есть лучшее решение для этого

Ответы [ 2 ]

3 голосов
/ 25 октября 2019

Вы можете взять записи и проверить все по заданному значению.

var filters = { balcony: false, garden: true, roofTerrace: true },
    wanted = Object.entries(filters), // [['balcony', false], ['garden', true], ['roofTerrace', true]]
    checkboxFilter = plotAreaFilter.filter(item => wanted.every(([k, v]) => item[k] === v));
2 голосов
/ 25 октября 2019

Вы можете попробовать следующее

  • Для каждого элемента в массиве plotAreaFilter выполните следующее
  • Проверьте это для каждого условия filter, где для каждого фильтра будет true, если *Фильтр 1008 *
  • не применяется или, если применяется, соответствующее значение для элемента равно true

var filters = {balcony: true,garden: true,roofTerrace: false};
var plotAreaFilter = [{"balcony": true, "garden": true}];

const checkboxFilter = plotAreaFilter.filter(item => Object.entries(filters).every(([key, value]) => !value || item[key])); 

console.log(checkboxFilter);

Для справки: Array.every & Object.entries

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...