基于另一列在 React 中聚合 table 中一列的值

Question

我正在从 api 中获取数据并将其显示在具有 2 列的 table 中。第一列包含名称，第二列包含金额，如表 1 所示。 api 中的数据包含重名且相同名称的金额不同。我想以这样一种方式显示，即汇总唯一名称的金额并仅显示唯一名称和总金额，如表 2 所示。我正在使用 ReactJS 来显示 table。获得此结果的更好逻辑是什么。我正在从 api 中以 json 的形式检索数据并将其放入数组中。我是 React 的新手，发现很难处理数据。

Answer 1

核心问题其实不是react相关的问题，所以考虑到我无法影响API，我们可以解决javascript中的聚合。这样做的一个有用的库是 "lodash" - 它知道如何做一个经典的“reduce”并且知道如何从一个对象创建一个数组。在节点控制台上解决这个问题，我们得到：

npm install lodash
node
>

...

const ld = require("lodash");
a = [{n: "joe", d: 1},{n: "joe", d: 1}, {n: "joe", d: 3} ]
b = ld.reduce(a, (agg, {n,d}) => { agg[n] = (agg[n] || 0) + d; return agg; }, {});
ld.map(b, (val,prop) => ({ n: prop, d: val});

最后一行的return值给你

[ { n: 'joe', d: 5 } ]

基于另一列在 React 中聚合 table 中一列的值

Aggregating the values of a column in table in React based on another column

javascript

frontend

reactjs

reactjs-native