ant design ant design Pro 中的table横向与纵向合并问题

根据条件,在每个数据渲染的render中设置

横向合并colSpan:要想右合并的单元格数量。0为隐藏当前单元格,设置的表格不会渲染,用于配合前面要合并的单元格使用。若一个单元格配置了colSpan:2合并两个单元格,则这个单元格后面的单元格设置为0,否则会横向顶出一个单元格。
纵向合并rowSpan:要向下合并的单元格数。与上面的解释一样。

可以直接通过column中的表头的render设置合并单元格参数

{
				title: "名称",
				dataIndex: "Name",
				hideInSearch: true,
				hideInForm: false,
				align: "center",
				rowSize: 1,
				colSize: 2,
				editable: true,
				width: 120,
				render: (text, record, index) => {
					const obj = {
						children: text !== null ? text : '',
						props: {},
					};
					if(undefined !== text && '' !== text  ){  
						obj.props.colSpan = 2;
					}
					return obj;
				},
			},

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值