鍍金池/ 問答/HTML/ antd table合并相同單元格問題

antd table合并相同單元格問題

業(yè)務(wù)需要要合并表格中的相同內(nèi)容
后臺(tái)返回了相同內(nèi)容的次數(shù)具體顯示在dataSource

const columns = [
    {
        title: '編號(hào)',
        dataIndex: 'rank',
        key: 'rank',
        render:(val,row,index)=>{
            const obj = {
                children:value,
                props:{}
            }
            //判斷maxRank(后臺(tái)返回相同內(nèi)容出現(xiàn)的次數(shù))的次數(shù)
            if(row.maxRank>0){
                obj.props.rowSpan = row.maxRank
            }else{
                obj.props.rowSpan = 0
            }
            return obj
            
        }
    },
    {
        title: '名字',
        dataIndex: 'name',
        key: 'name',
    }, 
    {
        title: '年齡',
        dataIndex: 'age',
        key: 'age',
    },
];

dataSource內(nèi)容:

const data = [
    {
        key:0,
        rank:'1',
        name:'aa',
        age:20,
        maxRank:3,//后臺(tái)返回的相同內(nèi)容出現(xiàn)的次數(shù)
    },
    {
        key:1,
        rank:'1',
        name:'aa',
        age:20,
        maxRank:0,//不需要合并的會(huì)表示0
    },
    {
        key:2,
        rank:'1',
        name:'aa',
        age:20,
        maxRank:0,
    },
    {
        key:3,
        rank:'2',
        name:'bb',
        age:22,
        maxRank:0,
    },
]

問題來了: 根據(jù)columns中判斷的話dataSource中的maxRank有大于0的,表格能成功合并。但是如果dataSource中的maxRank都是等于0(則沒有重復(fù)項(xiàng))就會(huì)出現(xiàn)單元格不顯示,我了解到obj.props.rowSpan = 0相當(dāng)于不渲染單元格 我的判斷方式是不是有錯(cuò)誤或者還需要添加某些判斷?或者還有其他實(shí)現(xiàn)方案?

回答
編輯回答
黑與白
2018年1月19日 04:34
編輯回答
默念

你需要把“編號(hào)”這一列第 2 行第 3 行的rowSpan設(shè)為 0

2018年4月29日 01:04
編輯回答
悶油瓶

解決了么 我也遇到了這個(gè)問題

2018年6月16日 21:16