使用lodash创建一个json地图的两级地图

Question

我有一个json列表，我试图用两个键重新组合这个地图中的对象。目前，我只是成功地使用lodash groupBy按一个键进行分组，但我无法找到创建行键的正确方法，并将大小/数量分组到此新数组中。我可以使用ES6或lodash在我的代码

const colorsMap= _.groupBy(colors, 'Id'); 

我最初的JSON看起来是这样的：

colors = [ 
{ 
    "Id": "1", 
    "color": "red", 
    "size": "10" 
    "QTY": "2000" 
    "ref": "tr" 
}, 
{ 
    "Id": "1", 
    "color": "red", 
    "size": "25" 
    "QTY": "3000" 
    "ref": "tr" 
}, 
{ 
    "Id": "1", 
    "color": "blue", 
    "size": "15" 
    "QTY": "2050" 
    "ref": "gt", 
}, 
{ 
    "Id": "2", 
    "color": "red", 
    "size": "18" 
    "QTY": "2010" 
    "ref": "tt" 
}, 
] 

，我想有这样的事情

[ 
"1": [ 
    { 
    "Id": "1", 
    "color": "red", 
    "row": [ 
      { 
      "size": "10" 
      "QTY": "2000" 
      }, 
      { 
      "size": "25" 
      "QTY": "3000" 
      }, 
      { 
      "size": "15" 
      "QTY": "0" 
      } 
     ], 
    "ref": "tr" 
    }, 
    { 
    "Id": "1", 
    "color": "blue", 
    "row": [ 
      { 
      "size": "10" 
      "QTY": "0" 
      }, 
      { 
      "size": "25" 
      "QTY": "0" 
      }, 
      { 
      "size": "15" 
      "QTY": "2050" 
      } 
     ], 
    "ref": "gt", 
    } 
], 
"2": [ 
    { 
    "Id": "2", 
    "color": "red", 
    "row": [ 
      { 
      "size": "18" 
      "QTY": "2010" 
      } 
     ], 
    "ref": "tt" 
    } 
    ] 
] 

Answer 1

分组后按颜色，然后再按颜色分组，然后将第二组的值映射到需要的对象上：

const colors = [{"Id":"1","color":"red","size":"10","QTY":"2000","ref":"tr"},{"Id":"1","color":"red","size":"25","QTY":"3000","ref":"tr"},{"Id":"1","color":"blue","size":"15","QTY":"2050","ref":"gt"},{"Id":"2","color":"red","size":"18","QTY":"2010","ref":"tt"}]; 
 

 
const result = _(colors) 
 
    .groupBy('Id') // group by id 
 
    .mapValues((values) => _(values) // map the values 
 
    .groupBy('color') // group by color 
 
    .mapValues((v) => ({ // map the resulting arrays 
 
     /* get the id and color from the 1st item in the array */ 
 
     id: v[0].Id, 
 
     color: v[0].color, 
 
     rows: v.map(({ size, QTY }) => ({ // map all elements to row objects 
 
     size, 
 
     QTY 
 
     })) 
 
    })) 
 
    .value()) 
 
    .value(); 
 

 
console.log(result);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>