Arrays 如何在React/Redux代码中使用groupby（前端新增）？

在React/Redux代码中运行此函数时遇到困难。我对React（主要是在后端工作）相当陌生，所以我不确定它为什么不能按预期运行。它在正确的地方吗？我也很难找到console.log在控制台中的打印位置，因为控制台是用prev action、action、next state模式设置的

我在我的“actions.js”中定义了这个函数（后面还会调用它）：

以下是调用函数的位置（同一文件）：

输入response.results.data如下所示：

[{"email": test@email.com, "is_active": true, "alert_id": 1, "pk": 1}, 
{"email": test@email.com, "is_active": true, "alert_id": 2, "pk": 2}, 
{"email": different@email.com, "is_active": true, "alert_id": 1, "pk": 3}]

[{"test@email.com": [{"is_active": true, "alert_id": 1, "pk": 1}, 
                    {"is_active": true, "alert_id": 2, "pk": 2}],
"different@email.com": [{"is_active": true, "alert_id": 1, "pk": 3}]}]

我希望它看起来像这样：

[{"email": test@email.com, "is_active": true, "alert_id": 1, "pk": 1}, 
{"email": test@email.com, "is_active": true, "alert_id": 2, "pk": 2}, 
{"email": different@email.com, "is_active": true, "alert_id": 1, "pk": 3}]

[{"test@email.com": [{"is_active": true, "alert_id": 1, "pk": 1}, 
                    {"is_active": true, "alert_id": 2, "pk": 2}],
"different@email.com": [{"is_active": true, "alert_id": 1, "pk": 3}]}]

但它似乎没有运行这个功能，我已经重新运行纱线建设和使用匿名

更新：这个功能确实有效！谢谢大家。redux开发工具非常有用。现在第二个问题是我需要添加我自己的密钥。。。。理想情况下，结果是这样的。最好不要用lodash！：

[{"email": "test@email.com",
"alerts": [{"is_active": true, "alert_id": 1, "pk": 1}, 
           {"is_active": true, "alert_id": 2, "pk": 2}]},
{"email": "different@email.com",
"alerts": [{"is_active": true, "alert_id": 1, "pk": 3}]}]

---

好的，首先控制台在seccion

控制台中。在那里，您可以查看所有console.log。在Chrome中，您可以按F12打开它

另一个问题，你需要的功能是：


//函数groupBy。
函数groupBy（数组、键）{
让arrayReduced=array.reduce(
（结果，{[key]：k，…rest}）=>{
（结果[k]=结果[k]| |[]）。推（静止）；
返回结果；
},
{}
);
回报率下降；
}
//您的示例数据。
常量组=[
{
电邮:'test@email.com',
你是活跃的吗，
警报id:1，
主键:1,，
},
{
电邮:'test@email.com',
你是活跃的吗，
警报id:2，
主键：2，
},
{
电邮:'different@email.com',
你是活跃的吗，
警报id:1，
主键：3，
},
];
//执行的功能
const result=groupBy（组“电子邮件”）；
//结果
控制台日志（结果）您可以使用与生成形状对象的分组相同的函数

{ [string]: object[] }

使用
Object.entries
可以将其转换为键值对数组，您可以将其映射到具有形状的对象数组

{
  email: string,
  alerts: object[],
}

功能更新

const groupBy = (array, key) =>
  array.reduce((result, { [key]: k, ...rest }) => {
    (result[k] = result[k] || []).push(rest);
    return result;
  }, {});

const groupDataBy = (array, key) =>
  Object.entries(groupBy(array, key)).map(([email, alerts]) => ({
    email,
    alerts
  }));

map函数回调
（[email，alerts]）=>（{email，alerts}）
使用数组分解将
[key，value]
数组分配给命名变量
email
和
alerts
，并使用对象速记法创建一个对象，其中包含为变量命名的键


const数据=[{
“电子邮件”：test@email.com",
“是否处于活动状态”：正确，
“警报id”：1，
“主键”：1
},
{
“电子邮件”：test@email.com",
“是否处于活动状态”：正确，
“警报id”：2，
“主键”：2
},
{
“电子邮件”：different@email.com",
“是否处于活动状态”：正确，
“警报id”：1，
“主键”：3
}
];
常量groupBy=（数组，键）=>
reduce（（结果，{[key]：k，…rest}）=>{
（结果[k]=结果[k]| |[]）。推（静止）；
返回结果；
}, {});
constgroupdataby=（数组，键）=>
Object.entries（groupBy（数组，键））.map（（[电子邮件，警报]）=>({
电子邮件，
警报
}));
const res=groupDataBy（数据，“电子邮件”）；
log（res）
Redux有许多连接应用程序所需的样板文件。对于您提供的有限代码段，您的操作之一似乎是发出异步api请求。为了调度异步操作，您至少需要一个包
redux-thunk
中间件。您能将相关代码移植到codesandbox中以便于调试吗？我用数据数组测试了您的
groupBy
函数，它的功能似乎与预期一样，而不是reduce函数返回一个对象而不是数组中的一个对象（可能这是有问题的输入错误）。不过，我确实不得不引用电子邮件文本。可能没有调用操作
getAlerts
或
updateFetchedAlerts
。您是否安装了redux开发工具，以便验证它们是否已被分派？除此之外，运行codesandbox将使我们更容易调试。感谢大家的回复。这段代码是一个更大的系统的一部分，有中间件等设置（我仍然不太清楚它是如何协同工作的，所以我可能会在这方面做一些研究）。这是我的第一次stackoverflow，所以我没有使用代码沙盒，但我会在今晚或早上发布，再次感谢！我安装了redux开发工具-感谢您的建议！看起来该函数实际工作正常。那是别的地方的一只虫子！再次感谢，太好了！是否有错误/错误消息，或者只是有错误，而您得到了意外的结果？我编辑了您的答案，因为您的代码正在更改原始数据，在代码分组后记录
组
数组，您将看到所有元素都从中删除了
电子邮件
属性。如果OP使用的是redux，他们会发现分组后状态发生了变化。谢谢你，我的JavaScript有很多工作要做。现在肯定缺少python字典@不，不用担心。很乐意帮忙。干杯