前端项目实战86-ant design table合并单元格

  {
            title: '房号',
            dataIndex: 'bedCode',
            key: 'bedCode',
            render: (value, record, index) => {
                // 处理列,相同数据则合并
                // 处理rowSpan
                const obj = {
                    children: value,
                    props: { rowSpan: 1 },
                };
                // 当检索到相同数据则返回 那条数据
                let arr = dataSource.filter((res: any) => {
                    return res.bedCode == record.bedCode;
                });
                if (index == 0 || dataSource[index - 1].bedCode != record.bedCode) {
                    // 匹配到相同数据的长度
                    obj.props.rowSpan = arr.length;
                } else {
                    // 如果上一行的数据与当前的数据相同,就将rowSpan变为0
                    obj.props.rowSpan = 0;
                }
                return obj;
            },
        },

posted @ 2022-10-22 17:03  前端导师歌谣  阅读(87)  评论(0)    收藏  举报