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

Question

我有以下类型的 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 的单个组件提供数据

Answer 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);