1

我是前端编程的新手/初级，但我正在帮助另一个人为应用程序构建 Web UI。在大多数情况下，我已经学到了足够多的东西来了解一切的基本概念，尽管我正在尝试添加一个有点困难的功能。

长话短说，我有两个 ag-grids（使用 reactJS）。主要的包含数据并且可以过滤，我正在尝试制作第二个，它不仅包含主要的列名，而且动态列出已应用的过滤器。第二个网格就像用户的助手/助手网格

到目前为止，我的理解帮助我完成了一半（我已经设法用主网格中的所有列标题填充第二个 ag-grid）。

列标题数据被存储并从道具中提取。类似于：

行数据：this.props.report.view.columns

如果您运行 console.log(this.props.report.view.columns) （我使用的是 chrome 开发人员工具中的控制台），您将看到一个包含 17 个对象的数组，其中包含列信息。结构如下图：

report: Object
|
--view: Object
  |
  --columns: Array(17)
    |
    --0: Object
    |  |
    |  -- field: "testColumn"
    |     headerName: "testColumn"
    |
    --1: Object
    --2: Object
    --3: Object
.
.
.   
    --16: Object

我只想说这看起来像一个由 17 个对象组成的数组，每个对象都包含两个键：值对。我想要做的是添加第三个键值对

我有另一个道具，它提供键：值对，只有应用了过滤器的列（即 columnName:blah ， filter:blahh ，其中列名存储在不同的键名下）。

我计划实现的伪代码是这样的：

For EACH element in the 17 Object array (this.props.report.view.columns)
    if headername = columnName (i.e. from column from filter prop)
THEN
    add new key:value pair headerName:filter; to that object element
ELSE 
    add new key:value pair headerName:''; (an empty value) to that object

我最终要做的是将这 17 个对象数组的 2 个键：值对更改为具有 3 个键值对的 17 个对象数组这样的事情可能吗？如果是这样，我可以得到一些建议吗？我有点担心我使用的整个计划是错误的。我的高级同事建议我使用回调使用不同的计划，但我不知道如果没有重大代码更改怎么可能（这就是我坚持直觉的原因）

4

1 回答 1

0

用map方法？https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/map

const data = [
  {a: 7, b: 0},
  {a: 4, b: 7},
  {a: 9, b: 6},
  {a: 1, b: 7},
];

const newData = data.map(currObj => ({...currObj, c: 0}));

console.log(newData);

于 2017-06-24T18:53:36.040 回答