react实现多条件搜索——可模糊搜索

const filter =
      (condition, data) => {
          return data.filter
            ((item: { [x: string]: any }) => {
                return Object.keys
                    (condition).every((key) => {
                      return String(item[key])
                        .toLowerCase()
                            .includes(String(condition[key]).trim().toLowerCase());
                    });
              });
        };

当你需要根据某个条件筛选数据时，上面的代码提供了一个通用的过滤函数。这个函数接受两个参数：condition和data。condition是一个包含筛选条件的对象，data是要进行筛选的数据数组

• 第1行：定义了一个名为 filter 的常量，它是一个函数。
• 第2行：filter 函数接受 condition 和 data 两个参数。
• 第3行：调用 data 数组的 filter 方法，对每个元素执行筛选操作。
• 第4行：对于每个元素 item，使用箭头函数定义筛选条件。
• 第5行：使用 Object.keys() 方法获取 condition 对象的所有键。
• 第6行：对于 condition 的每个键 key，使用 Array.prototype.every() 方法来判断是否每个键值对都满足条件。
• 第7行：将 item[key] 转换为字符串，并转换为小写字母。
• 第8行：使用 String.prototype.includes() 方法检查字符串中是否包含了筛选条件的值。
• 第9行：返回当前键值对的筛选结果。
• 第10行：返回最终的筛选结果数组。

使用实例：

const text = "example";
const msg = {
  data: [
    { name: "John Doe", age: 25 },
    { name: "Jane Smith", age: 30 },
    { name: "Bob Johnson", age: 35 },
  ],
};
 
const search_list = filter({ name: text }, msg.data);
console.log(search_list);

以上代码将根据 name 属性进行筛选，筛选条件为 text 变量的值。最终输出符合条件的结果数组。