Question

问题

我想在我的项目上实现一个数据表，而我为该表提供的数据如下所示：

data=[
  {
    key: "value",
    anotherKey: "bar",
  },
  {
    key: "value",
    anotherKey: {
      "nestedKey": "nestedValue",
      "foo": "bar"
    },
  },
  {
    key: "value",
    anotherKey: "foo",
  },
]

所以基本上我有一个对象数组，并且其中的 some 对象可能包含嵌套数据，这些数据也必须呈现到表中。

现在，由于我只是“允许”将键/值配对的对象数组传递给表，所以这会中断。

我想实现的目标

我希望嵌套对象采用可渲染的方式，以便可以通过数据表对其进行渲染。

我尝试过的

const transformedData = data.map(d => {
  return Object.keys(d).forEach(key => {
    if (typeof key === "object") {
      d[key] = <p>{d[key]}</p>
    } 
  })
})

不幸的是，这根本没有解决。

我非常确定我在这里使事情变得非常复杂，希望对您有所帮助。我之前看过Google，但找不到任何合理的答案。

谢谢！

Answer 1

您朝着正确的方向前进，通过扩展您的解决方案，我能够提出这个建议

transformedData = data.map( v => {
    let d = {...v}
    Object.keys(d).forEach(key => {
        if (typeof d[key] === "object") {
            d[key] = Object.keys(d[key]).reduce((acc, nestedKey) => {
                return acc + '<p>' + nestedKey + ':' + d[key][nestedKey] + '</p>'
            }, '')
        }
    });
    return d;
})

它正在工作，但是我敢肯定会有比这更好的解决方案。

数据表的“平面”嵌套对象

问题

我想实现的目标

我尝试过的

1 个答案: