如何实现过滤过滤器通过搜索多个属性值在javascript



我想根据我在输入字段中输入的内容获得结果。此搜索可以通过多个关键字过滤,如firstName, lastName, emailId。

这是我的数组对象,

var resData = [
            {
                firstName:"Jhon",
                lastName:"adam",
                emailId:"jhn12@gmail.com"
            },
            {
                firstName:"Kyle",
                lastName:"Miller",
                emailId:"kl12@gmail.com"
            },
            {
                firstName:"Jhonathan",
                lastName:"adam",
                emailId:"jadm12@gmail.com"
            },
            {
                firstName:"Lewis",
                lastName:"harber",
                emailId:"lewh12@gmail.com"
            }
        ];

Javascript代码,

resData.filter(data, function(item){
                        item.map(function(list, i) {
                            if (list.firstName.toLowerCase().indexOf(self.state.inputValue.toLowerCase()) === -1 || list.lastName.toLowerCase().indexOf(self.state.inputValue.toLowerCase()) === -1 || list.emailId.toLowerCase().indexOf(self.state.inputValue.toLowerCase()) === -1) {
                                return;
                            }
                            console.log(list);
                        });
                    });

您可以遍历键,如果找到某个值,则为过滤器返回true。

var resData = [{ firstName: "Jhon", lastName: "adam", emailId: "jhn12@gmail.com" }, { firstName: "Kyle", lastName: "Miller", emailId: "kl12@gmail.com" }, { firstName: "Jhonathan", lastName: "adam", emailId: "jadm12@gmail.com" }, { firstName: "Lewis", lastName: "harber", emailId: "lewh12@gmail.com" }],
    self = { state: { inputValue: 'adam' } },
    result = resData.filter(function (item) {
        return Object.keys(item).some(function (k) {
            return item[k].toLowerCase().indexOf(self.state.inputValue.toLowerCase()) !== -1;
        });
    });
   
console.log(result);

使用预定义的键

var resData = [{ firstName: "Jhon", lastName: "adam", emailId: "jhn12@gmail.com" }, { firstName: "Kyle", lastName: "Miller", emailId: "kl12@gmail.com" }, { firstName: "Jhonathan", lastName: "adam", emailId: "jadm12@gmail.com" }, { firstName: "Lewis", lastName: "harber", emailId: "lewh12@gmail.com" }],
    self = { state: { inputValue: 'adam' } },
    result = resData.filter(function (item) {
        return ['firstName', 'lastName'].some(function (k) {
            return item[k].toLowerCase().indexOf(self.state.inputValue.toLowerCase()) !== -1;
        });
    });
   
console.log(result);

var resData = [
        {
            firstName:"Jhon",
            lastName:"adam",
            emailId:"jhn12@gmail.com"
        },
        {
            firstName:"Kyle",
            lastName:"Miller",
            emailId:"kl12@gmail.com"
        },
        {
            firstName:"Jhonathan",
            lastName:"adam",
            emailId:"jadm12@gmail.com"
        },
        {
            firstName:"Lewis",
            lastName:"harber",
            emailId:"lewh12@gmail.com"
        }
    ];
var search = function(text) {
  text = text.toLowerCase();
  return resData.filter(x => x.firstName.toLowerCase().indexOf(text) >= 0 
       || x.lastName.toLowerCase().indexOf(text) >= 0 
       || x.emailId.toLowerCase().indexOf(text) >= 0);
}
console.log(search("Adam"));

看起来你想按任意键进行搜索…

var resData = [{
  firstName: "Jhon",
  lastName: "adam",
  emailId: "jhn12@gmail.com"
}, {
  firstName: "Kyle",
  lastName: "Miller",
  emailId: "kl12@gmail.com"
}, {
  firstName: "Jhonathan",
  lastName: "adam",
  emailId: "jadm12@gmail.com"
}, {
  firstName: "Lewis",
  lastName: "harber",
  emailId: "lewh12@gmail.com"
}];
//var searchString = self.state.inputValue.toLowerCase();
var searchString = "adam".toLowerCase();
// filter the data
var filteredData = resData.filter(function(item) {
  // for each item int he array, check each key value
  for (key in item) {
    // if the key value matches the search string then return true
    if (item[key].toLowerCase() == searchString) return true;
  }
  // if we get here that means none of the values in the item were a match so return false
  return false;
});
console.log(filteredData);

最新更新