首页 > 解决方案 > 如何根据 React,ES6 中对象数组的搜索输入过滤数据

问题描述

我有以下方式来自 API 的 JSON 数据模式。我能够用body键过滤数据。我正在尝试实现搜索功能,该功能应该搜索所有对象数组,而与key用户输入无关。有人可以指导如何实现这一目标。我尝试使用嵌套的 for 循环来获取单个密钥,但不是运气。

[
  {
    "postId": 1,
    "id": 1,
    "name": "id labore ex et quam laborum",
    "email": "Eliseo@gardner.biz",
    "body": "laudantium enim quasi est quidem magnccusantium"
  },
  {
    "postId": 1,
    "id": 2,
    "name": "quo vero reiciendis velit similique earum",
    "email": "Jayne_Kuhic@sydney.com",
    "body": "est natus enim nihil est dolore is et"
  }
  ...
]

我目前正在使用的基于键的搜索逻辑

const filteredData = data.filter(item =>
      item.body.includes(searchTerm.value)
    );
    this.setState({ filteredData: filteredData });

我使用Sandbox创建了一个工作示例。谁能指导如何从整个对象数组中获得搜索结果?

标签: javascriptreactjsecmascript-6

解决方案


试试这个:

const filteredData = data.filter(item => Object.values(item).some(val => val.toString().includes(searchTerm.value)));

推荐阅读