Question

我的应用程序中有一些过滤器。每当我单击搜索时，都应该根据搜索的值过滤数据。我不知道是否有更好的方法可以以凉爽的方式或幻想的方式来做我想做的事情。搜索值的存储方式如下：

FORM_VALUES =
   {
     title: '',
     name: 'John',
     Age: 56
    }

如果对象的值为空''，则在过滤对象数组时不应该考虑它们。我的对象数组看起来像这样：

[
 {
   title:'CEO',
   name: 'John',
   Age: 56
 },
 {
   title: null,
   name: 'George',
   Age: 56
 },
]

在此示例中，它应该返回数组的第一个元素。

我的代码：

data.filter(d => {
     if ((d.title === FORM_VALUES.title || FORM_VALUES.title === '')
        && (d.name === FORM_VALUES.name || FORM_VALUES.name === '')
        && (d.age === FORM_VALUES.age || FORM_VALUES.age === '')) {
           return d;
      }
 });

Answer 1

使用FORM_VALUES从Object.entries()对象中获取键/值对的数组。对每个对使用Array.every()来对数组进行迭代，如果值true（空字符串）或过滤器的值与当前对象的值匹配，则返回''。

const FORM_VALUES = {"title":"","name":"John","Age":56}

const data = [{"title":"CEO","name":"John","Age":56},{"title":null,"name":"George","Age":56}]

const result = data.filter(o =>
  Object.entries(FORM_VALUES)
    .every(([k, v]) => v === '' || o[k] === v)
)

console.log(result)

Answer 2

使用filter获取具有值的人员，并使用Object.keys和delete删除所有空条目，并使用every和Object.entries查找实际对象：

const FORM_VALUES = {
  title: '',
  name: 'John',
  Age: 56
}

const data = [{
    title: 'CEO',
    name: 'John',
    Age: 56
  },
  {
    title: null,
    name: 'George',
    Age: 56
  }
];

let searchObj = { ...FORM_VALUES };
Object.keys(searchObj).forEach(key => searchObj[key] == "" ? delete searchObj[key] : key);

const found = data.filter(d => Object.entries(searchObj).every(([k, v]) => d[k] == v));
console.log(found);

根据具有过滤器值的对象过滤数据

2 个答案: