如何通过键名称遍历数组，如果键为空，则将它们包含在循环js中

Question

我有如下数组：

{
  "": [
    {
      "id": 3,
      "branch": null,
      "classification": null,
      "theme": null,
      "branch_id": null,
      "classification_id": null,
      "project_id": null,
      "theme_id": null,
      "projectname": "project tests",
      "comment": "commentsss",
      "customername": "alex",
      "lead1id": 2,
      "lead1percent": "2.0",
      "lead2id": 2,
      "lead2percent": "2.0",
      "lead3id": 2,
      "lead3percent": "3.0",
      "lead_plans": [
        {
          "id": 1,
          "lead_id": 3,
          "addcosts": "3.0",
          "fee": "3.0",
          "plan2": "3.0",
          "plan3": "2.0",
          "probability": "3.0",
          "year": "2020-02-12"
        }
      ],
      "offers": [
        {
          "id": 1,
          "lead_id": 3,
          "addcosts": "2.0",
          "addcostsinfo": "some infoss",
          "days": "2020-02-12",
          "decision": "goodss",
          "decisiondate": "2020-02-12",
          "fee": "2.0",
          "mail": "mail goes here",
          "offerdate": "2020-02-12",
          "paper": "xyz"
        }
      ]
    },
    {
      "lead1percent": 2,
      "lead2percent": 2,
      "lead3percent": 3
    }
  ],
  "Electrical": [
    {
      "id": 4,
      "branch": "Electrical",
      "classification": "Warm22",
      "theme": "Lean",
      "branch_id": 2,
      "classification_id": 1,
      "project_id": null,
      "theme_id": 3,
      "projectname": "TEST PROJECT",
      "comment": "",
      "customername": "tets cuso",
      "lead1id": 2,
      "lead1percent": "1.3",
      "lead2id": 16,
      "lead2percent": "4.5",
      "lead3id": 1,
      "lead3percent": "4.5",
      "lead_plans": [
        {
          "id": 2,
          "lead_id": 4,
          "addcosts": "7.8",
          "fee": "5.6",
          "plan2": "2.3",
          "plan3": "3.4",
          "probability": "1.1",
          "year": "2020-05-10"
        },
        {
          "id": 35,
          "lead_id": 4,
          "addcosts": "6.9",
          "fee": "2.7",
          "plan2": "7.5",
          "plan3": "3.6",
          "probability": "1.7",
          "year": "2008-12-09"
        },
        {
          "id": 37,
          "lead_id": 4,
          "addcosts": "6.8",
          "fee": "2.7",
          "plan2": "8.3",
          "plan3": "1.9",
          "probability": "4.8",
          "year": "2001-12-07"
        }
      ],
      "offers": [
        {
          "id": 2,
          "lead_id": 4,
          "addcosts": "8.6",
          "addcostsinfo": "TEST",
          "days": null,
          "decision": "TEST",
          "decisiondate": "2020-06-15",
          "fee": "2.4",
          "mail": "TEST",
          "offerdate": "2020-05-12",
          "paper": "TEST"
        }
      ]
    },
    {
      "lead1percent": 1.3,
      "lead2percent": 4.5,
      "lead3percent": 4.5
    }
  ]
}

而且我想对其进行迭代以进行如下所示的列表：

我之前尝试的代码是：

{
                                    leads_list.map((h, index) => {
                                        const lead_plans_totals = h.lead_plans.reduce(
                                            (accumulator, currentDau) => {
                                                return {
                                                    probability: accumulator.probability + parseFloat((currentDau.probability || 0)),
                                                    plan2: accumulator.plan2 + parseFloat((currentDau.plan2 || 0)),
                                                    plan3: accumulator.plan3 + parseFloat((currentDau.plan3 || 0))
                                                };
                                            }, {
                                                probability: 0,
                                                plan2: 0,
                                                plan3: 0
                                            }
                                        );

                                        const offers_totals = h.offers.reduce(
                                            (accumulator, currentDau) => {
                                                return {
                                                    addcosts: accumulator.addcosts + parseFloat((currentDau.addcosts || 0)),
                                                    fee: accumulator.fee + parseFloat((currentDau.fee || 0))
                                                };
                                            }, {
                                                addcosts: 0,
                                                fee: 0
                                            }
                                        );

                                        return <TableRow key={`mi-${index}`}
                                                         className={index % 2 == 0 ? 'grey_row' : ''}>
                                            <TableCell align="right" colSpan={2}>
                                                <IconButton onClick={() => this.launchEditLeadPlanOfferDialog(h)}>
                                                    <EditIcon/>
                                                </IconButton>
                                                <IconButton onClick={() => this.launchDeleteContactDialog(h.id)}>
                                                    <DeleteIcon/>
                                                </IconButton>
                                            </TableCell>
                                            <TableCell align="right">{h.projectno}</TableCell>
                                            <TableCell align="right">{h.customername}</TableCell>
                                            <TableCell align="right">{h.projectname}</TableCell>
                                            <TableCell align="right">{h.branch}</TableCell>
                                            <TableCell align="right">{h.theme}</TableCell>
                                            <TableCell align="right">{h.classification}</TableCell>
                                            <TableCell align="right">{lead_plans_totals.probability}</TableCell>
                                            <TableCell align="right">{lead_plans_totals.plan2}</TableCell>
                                            <TableCell align="right">{lead_plans_totals.plan3}</TableCell>
                                            <TableCell align="right">{offers_totals.addcosts}</TableCell>
                                            <TableCell align="right">{offers_totals.fee}</TableCell>
                                            <TableCell align="right">{h.lead1id}</TableCell>
                                            <TableCell align="right">{h.lead1percent}</TableCell>
                                            <TableCell align="right">{h.lead2id}</TableCell>
                                            <TableCell align="right">{h.lead2percent}</TableCell>
                                            <TableCell align="right">{h.lead3id}</TableCell>
                                            <TableCell align="right">{h.lead3percent}</TableCell>
                                            <TableCell align="right">{h.comment}</TableCell>
                                        </TableRow>
                                    })
                                }

当前，使用上面的数组，它给我类似的错误：

TypeError: leads_list.map is not a function
LeadsSearchResults.render
src/container/Leads/LeadsSearchResults.js:397
  394 |         <TableCell align="right">Kommentar</TableCell>
  395 |     </TableRow>
  396 | </TableHead>
> 397 | <TableBody>
      | ^  398 |     {
  399 |         leads_list.map((h, index) => {
  400 |             const lead_plans_totals = h.lead_plans.reduce(

我也尝试过使用forEach，但结果类似。我认为问题在于它包含空键，但是我不确定如何使用键和求和数组对其进行迭代。

Answer 1

您的问题是您的数据是对象而不是数组。您首先需要获取密钥，然后才能在其上进行映射。

Object.keys(leads_list).map(key => {
    const h = leads_list[key];
    ... the rest of your code ...
});