700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > ant-design for vue. table合并单元格通用方法

ant-design for vue. table合并单元格通用方法

时间:2020-02-13 12:04:34

相关推荐

ant-design for vue. table合并单元格通用方法

主要思想是通过遍历是否有相同的字段,并判断相同字段的数量,相关代码如下。

const columns = ref([{title: "分类",dataIndex: "name",customCell: (text, record, index) => {const textName = text.nameconst obj = {children: textName !== null ? textName : "",attrs: {}}obj.attrs.rowSpan = mergeCells(textName, "name", record)return obj.attrs}},{title: "模块名称",dataIndex: "moduleName",align: "center"},{title: "说明",dataIndex: "details",align: "center",width: 360},])

function mergeCells(text, key, index) {if (index !== 0 && text === dataSource.value[index - 1][key]) {return 0}let rowSpan = 1for (let i = index + 1; i < dataSource.value.length; i++) {if (text !== dataSource.value[i][key]) {break}rowSpan++}return rowSpan}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。