使用嵌套对象迭代 json 并根据属性值进行过滤

Posted 2023-02-22

【中文标题】使用嵌套对象迭代 json 并根据属性值进行过滤

【英文标题】：Iterating a json with nested objects and filtering depending on attributes values

【发布时间】：2022-01-20 22:21:30

【问题描述】：

我有以下类型的 json 文件：

  "trees":
     "name":"a",
     "age":"9",
     "height":"10",
     "location":"park"
  ,
  "cars":
     "name":"b",
     "age":"3",
     "height":"0.0",
     "location":"park"
  ,
  "bikes":
     "name":"c",
     "age":"110",
     "height":"0.0",
     "location":"park"
  

在我的 react 应用程序中发生的情况是，我将这个 json 从 app.js 发送到子组件 (1)，然后我从那里将单个值发送到另一个组件 (2) 以便连续表示。 现在我有一个问题，我想在组件（2）中发送数据，只有在 height!=0.0 时我无法做到。

这是我的组件(1)：

Object.entries(props.data).map(
  ([key, 
    // name, age, height, location
    ...e
  ]) => 
    return (<tr> <Single key=key ...e /> </tr>)
  
)

我想对其进行过滤，以便不向高度 == 0.0 的单个组件提供数据

【问题讨论】：

顺便说一句，你有一个对象，而不是 JSON，它始终是一个字符串。

实际上这是一个示例，原始 json 包含字符串中的所有内容，但你能告诉我这个对象的解决方案如何也适用于 json 吗？

这只是不使用 JSON 和对象/数组作为同义词的余数。如果您在解析/字符串化方面遇到问题，那么您将使用 JSON 来处理所有其他您正在谈论的来自 javascript 的某些数据类型。

【参考方案1】：

您可以先使用Object.entries 获取键值对，然后使用filter 过滤掉您不想要的值。简单

const result = Object.entries(obj)
                     .filter((o) => o[1].height !== "0.0")
                     .map([k, v] => (<tr> <Single key=key ...e /> </tr>))

const obj = 
  trees: 
    name: "a",
    age: "9",
    height: "10",
    location: "park",
  ,
  cars: 
    name: "b",
    age: "3",
    height: "0.0",
    location: "park",
  ,
  bikes: 
    name: "c",
    age: "110",
    height: "0.0",
    location: "park",
  ,
;

const result = Object.entries(obj).filter((o) => o[1].height !== "0.0");
console.log(result);

【讨论】：

无需将其转回对象，OP 正在迭代条目。

我同意，很棒的收获?

什么是 OP...还需要取回一个对象，因为数据中的代码被发送到 singledata 组件它只接受一个对象>???

OP 是提出问题的人，或者我会说该特定问题的作者。 YUP 编辑了答案。