Фильтровать массив объектов по нескольким ключам - PullRequest
Новая
       24

Фильтровать массив объектов по нескольким ключам

0 голосов
/ 25 сентября 2019

У меня есть таблица реагирования, которую я пытаюсь отфильтровать по нескольким столбцам с помощью функции фильтра.Если я фильтрую по одному столбцу, это хорошо, но если я добавляю другой столбец, он фильтрует только по этому, а не по обоим.Примером будет название «Скотт».Я хочу отфильтровать столбец first_name по нему, а также столбец biz_name по нему.Но когда я устанавливаю флажок, чтобы изменить состояние этого столбца, он фильтрует только один.Вот флажок, в котором я проверил состояние, чтобы убедиться, что он работает правильно. 

                           <Checkbox
                                label="Business Name"
                                onCheck={event => {
                                  if (event.target.checked) {
                                    this.setState({
                                      filterBusinessName: true
                                    });
                                  } else {
                                    this.setState({
                                      filterBusinessName: false
                                    });
                                  }

                                }}
                              />
                              <Checkbox
                                label="First Name"
                                onCheck={event => {
                                  if (event.target.checked) {
                                    this.setState({
                                      filterFirstName: true
                                    });
                                  } else {
                                    this.setState({
                                      filterFirstName: false
                                    });
                                  }

                                }}
                              />

А затем вот функция фильтра над таблицей: 

let items = this.state.contacts


      if (this.state.term && items.length > 0) {
        let searchTerm = this.state.term.toLowerCase()
        items = items.filter(row => {

          if(this.state.filterBusinessName && row.biz_name){ 

              return row.biz_name.toLowerCase().includes(searchTerm)

          }

          if(this.state.filterFirstName && row.first_name){ 

            return row.first_name.toLowerCase().includes(searchTerm)

          }

          if(this.state.filterFirstName && row.first_name && this.state.filterBusinessName && row.biz_name){ 

            return row.first_name.toLowerCase() == searchTerm || row.biz_name.toLowerCase() == searchTerm

          }


        })
      }

1 Ответ

1 голос
/ 25 сентября 2019

Я думаю, вы хотите что-то вроде этого 

let items = this.state.contacts;

if (this.state.term && items.length > 0) {
  let searchTerm = this.state.term.toLowerCase();
  items = items.filter(row => {
    if (
      this.state.filterBusinessName &&
      row.biz_name &&
      row.biz_name.toLowerCase().includes(searchTerm)
    ) {
      return true;
    }

    if (
      this.state.filterFirstName &&
      row.first_name &&
      row.first_name.toLowerCase().includes(searchTerm)
    ) {
      return true;
    }

    return (
      this.state.filterFirstName &&
      row.first_name &&
      this.state.filterBusinessName &&
      row.biz_name &&
      (row.first_name.toLowerCase() == searchTerm ||
        row.biz_name.toLowerCase() == searchTerm)
    );
  });
}

Основное отличие здесь в том, что функция будет возвращать false только в том случае, если она не соответствует ни одной.Перед немедленным возвратом false, если он не соответствует ни одной из проверок фильтра.

Определенно, можно сделать некоторую оптимизацию, чтобы сделать это более понятным.Но это иллюстрирует идею.Надеюсь, это поможет

...