antd React table 根据返回数据合并单元格

1.首先获取需要判断是否合并的字段,取出来去重之后存到数组中:

方法

1.for each 2.reduce 3.for of   获取需要合并得数据字段 去重

2.for each 2.reduce 3.for of  循环后台返回数据,根据所对应得合并字段的索引值进行判断,索引值为0时 设置rowSpan

以reduce为例:第一个参数为累加函数,第二个参数为初始值

data.reduce((arr, item) => {

            console.log(arr,'arr');

            console.log(item,'item')

            //首先将tag字段作为新数组arr取出

            if (arr.indexOf(item.tag) < 0) {

                arr.push(item.tag)

            }

            return arr

        }, []).reduce((arr, tag) => {

            //将name相同的数据作为新数组取出,并在其内部添加新字段**rowSpan**

            const children = data.filter(item => item.tag === tag);

            arr= arr.concat(

                children.map((item, index) => ({

                    ...item,

                    rowSpan: index === 0 ? children.length : 0,//将第一行数据添加rowSpan字段

                }))

            )

            return arr;

        }, [])

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值