Arrays 反应groupBy并打印到表中

编辑： 方法groupBy、omit和mapValue从以下位置导入：

import groupBy from 'lodash/groupBy';
import mapValues from 'lodash/mapValues';
import omit from 'lodash/omit';

我有这个json

[{
    "name": "Jitka",
    "orderNumber": "1",
    "order": false
},
{
    "name": "Jitka",
    "orderNumber": "0",
    "order": false
},
{
    "name": "Petr",
    "orderNumber": "6",
    "order": false
}]

在react中，我需要按名称分组值。分组后，我需要将数据以格式打印到表中

问题是，如何将我按名称分组的数据转换成这种格式的表

我的代码是：

{
        const ordersByName = groupBy(this.state && this.state.orders, 'name');
        let order = mapValues(ordersByName, x => x.map(y => omit(y, 'name')));
        this.state.sortedOrders.push(order);

    }

    return (
        <div>
            <MyNavbar/>
            <div className="container">
                <table className="table">
                    <tbody>
                    <tr>
                        <th>Name</th>
                        <th>Order number</th>
                        <th>Order</th>
                    </tr>
                    {this.state.sortedOrders.map((offer) => {
                        console.log(offer);

                    })}
                    </tbody>
                </table>
            </div>
        </div>

{
const ordersByName=groupBy（this.state&&this.state.orders，'name'）；
让order=mapValues（ordersByName，x=>x.map（y=>omit（y，'name'）））；
此。状态。分拣机。推送（订单）；
}
返回(
名称
订单号
命令
{this.state.sortedOrders.map（（offer）=>{
控制台日志（报价）；
})}

---

谢谢。

您的数据需要先减少，因为您基本上是在

订单号上分组的。因此，既然您已经在使用lodash，您可以尝试这样做：

let data = _(this.state.sortedOrders) // <-- chain this array via _.chain
  .groupBy('name')  // <-- group by name first
  .mapValues(arr =>  // <-- map through the values of the object from groupBy
    _.mergeWith(  // <-- merge the grouped by name records
      ..._.sortBy(arr, 'orderNumber'),  // <-- sort the array by `orderNumber`
      (o, s, k) => _.isEqual(k, 'orderNumber') ? o + (s ? ',' + s : '') : o)
  )
  .values() // <-- get the values of the final object
  .value()  // <-- get the final result from the chaining

您的数据需要先减少，因为您基本上是在
订单号上分组的。因此，既然您已经在使用lodash，您可以尝试这样做：

let data = _(this.state.sortedOrders) // <-- chain this array via _.chain
  .groupBy('name')  // <-- group by name first
  .mapValues(arr =>  // <-- map through the values of the object from groupBy
    _.mergeWith(  // <-- merge the grouped by name records
      ..._.sortBy(arr, 'orderNumber'),  // <-- sort the array by `orderNumber`
      (o, s, k) => _.isEqual(k, 'orderNumber') ? o + (s ? ',' + s : '') : o)
  )
  .values() // <-- get the values of the final object
  .value()  // <-- get the final result from the chaining

此解决方案用于创建联合组函数。该函数接受迭代对象（可以用作迭代对象的任何对象），以及应收集为数组的键的列表。结果是一个新函数，该函数可以由迭代者分组，然后合并每个组，并组合
collectKeys
中任何键的值：


const{flow，partiOK:pr，groupBy，map，mergeWith}=\u；//模拟单独的导入
const combineGroups=（迭代器、集合键）=>flow(
pr（groupBy、iteratee），
pr（map，group=>mergeWith（{}，…group，（t=[]，s，k）=>
集合键。包括（k）？[…t，s]：s）
)
);
const combineGroupsByName=combineGroups（'name'，['orderNumber']）；
const Demo=（{orders}）=>{
const ordersByName=组合组SYNAME（订单）；
返回(
名称
订单号
命令
{ordersByName.map（{name，orderNumber，order}）=>(
{name}
{orderNumber.sort（）.join（'，'）}
{order.toString（）}
))}
);
};
const orders=[{“name”：“Jitka”，“orderNumber”：“1”，“order”：false}，{“name”：“Jitka”，“orderNumber”：“0”，“order”：false}，{“name”：“Petr”，“orderNumber”：“6”，“order”：false}]；
ReactDOM.render(
,
演示
)；

此解决方案用于创建联合组函数。该函数接受迭代对象（可以用作迭代对象的任何对象），以及应收集为数组的键的列表。结果是一个新函数，该函数可以由迭代者分组，然后合并每个组，并组合
collectKeys
中任何键的值：


const{flow，partiOK:pr，groupBy，map，mergeWith}=\u；//模拟单独的导入
const combineGroups=（迭代器、集合键）=>flow(
pr（groupBy、iteratee），
pr（map，group=>mergeWith（{}，…group，（t=[]，s，k）=>
集合键。包括（k）？[…t，s]：s）
)
);
const combineGroupsByName=combineGroups（'name'，['orderNumber']）；
const Demo=（{orders}）=>{
const ordersByName=组合组SYNAME（订单）；
返回(
名称
订单号
命令
{ordersByName.map（{name，orderNumber，order}）=>(
{name}
{orderNumber.sort（）.join（'，'）}
{order.toString（）}
))}
);
};
const orders=[{“name”：“Jitka”，“orderNumber”：“1”，“order”：false}，{“name”：“Jitka”，“orderNumber”：“0”，“order”：false}，{“name”：“Petr”，“orderNumber”：“6”，“order”：false}]；
ReactDOM.render(
,
演示
)；

什么是
groupBy
？在哪里实施？您面临的问题是什么？什么是
groupBy
？在哪里实施？您面临的问题是什么？