antd 상위 셀과 값이 같을 경우 셀 병합

2023. 4. 11. 16:31개발/토막난 상식

반응형
const renderCell = (value, row, index) => {
    const obj = {
        children: value, // 셀에 표시될 값
        props: {}, // 셀의 속성을 설정할 객체
    };
    
    if (index > 0 && row.hirkCommCd === codeData[index - 1].hirkCommCd) {
        // 이전 행과 현재 행의 상위코드 값이 같다면, 병합할 필요가 없으므로 rowSpan을 0으로 설정
        obj.props.rowSpan = 0;
    } else {
        // 현재 행의 상위코드 값과 다른 행을 찾아서 연속된 행의 개수를 구함
        for (let i = index; i < codeData.length; i++) {
            if (row.hirkCommCd !== codeData[i].hirkCommCd) {
                break;
            }
            obj.props.rowSpan = obj.props.rowSpan ? obj.props.rowSpan + 1 : 1;
        }
    }
    
    return obj; // 셀의 속성이 설정된 객체를 반환
<Table.Column
   		*** 생략 ***
        render={renderCell}
      />

 

반응형