在reactjs中以復雜的方式迭代陣列-有解無憂

回應 JSON：

[
    [{
            "name": "IMG00177.png",
            "class": "Pore",
            "confidence": "0.9",
            "bbox": [160.0, 916.0, 169.0, 925.0],
            "segmentation": []
        },
        {
            "name": "IMG00177.png",
            "class": "Pore",
            "confidence": "0.81",
            "bbox": [107.0, 890.0, 112.0, 896.0],
            "segmentation": []
        },
        {
            "name": "IMG00177.png",
            "class": "Pore",
            "confidence": "0.57",
            "bbox": [119.0, 871.0, 123.0, 873.0],
            "segmentation": []
        },
        {
            "name": "IMG00177.png",
            "class": "Pore",
            "confidence": "0.63",
            "bbox": [343.0, 703.0, 346.0, 705.0],
            "segmentation": []
        },
        {
            "name": "IMG00177.png",
            "class": "Pore",
            "confidence": "0.9",
            "bbox": [337.0, 692.0, 345.0, 701.0],
            "segmentation": []
        }
    ],
    [{
            "name": "IMG00178.png",
            "class": "Pore",
            "confidence": "0.53",
            "bbox": [1183.0, 1078.0, 1185.0, 1081.0],
            "segmentation": []
        },
        {
            "name": "IMG00178.png",
            "class": "Pore",
            "confidence": "0.83",
            "bbox": [155.0, 1002.0, 161.0, 1008.0],
            "segmentation": []
        },
        {
            "name": "IMG00178.png",
            "class": "Pore",
            "confidence": "0.72",
            "bbox": [107.0, 891.0, 111.0, 893.0],
            "segmentation": []
        },
        {
            "name": "IMG00178.png",
            "class": "Pore",
            "confidence": "0.77",
            "bbox": [121.0, 871.0, 126.0, 873.0],
            "segmentation": []
        }
    ]
]

這是我的 api 發布請求的回應陣列。我有一個空陣列，我想檢查另一個串列的影像名稱是否相同。我想決議串列中的那個 bbox 值。所需格式：

[
{
"name":"1.png",
"confidence":[[0.9],[0.9],[0.9],[0.9],[0.9]],
"bbox":[[160.0, 916.0, 169.0, 925.0],[107.0, 890.0, 112.0, 896.0],[119.0, 871.0, 123.0, 873.0],[343.0, 703.0, 346.0, 705.0]]

}
]

我不知道如何迭代它以獲得所需的格式。請指導我解決這個問題

uj5u.com熱心網友回復：

您可以嘗試以下代碼以獲得所需的輸出。為了更好地理解，我已經在一個單獨的變數中撰寫了捕獲回應的每個操作，但可以隨意重構為更少的代碼行。如果它滿足您的要求，請告訴我。

const flatArray = [].concat.apply([], response);

const flatMap = flatArray.reduce((accum, e) => {
  if (!accum[e.name]) {
    accum[e.name] = {
      name: e.name,
      bbox: [e.bbox],
      confidence: [[e.confidence]]
    };
  } else {
    accum[e.name].confidence.push([e.confidence]);
    accum[e.name].bbox.push(e.bbox);
  }
  return accum;
}, {});

console.log(Object.values(flatMap));

控制臺快照。

在reactjs中以復雜的方式迭代陣列

轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/447829.html

標籤：数组反应 json

上一篇：React和TypeScript：如何將引數傳遞給型別的事件處理程式：MouseEventHandler

下一篇：在UseEffect中反應axios等待調度