为table添加多行合并表头（同时保留真实表头的过滤功能）

收藏

本帖最后由 Ellia.Duan 于 2023-11-27 14:53 编辑

很对用户在使用table时，都有给table添加多行合并表头的需求。下图就是一个典型的多行合并表头需求，

对于table表头，在excel中，你会发现实际是不支持被合并的

spreadjs虽然做了扩展，可以合并table 表头，但是合并后，table表头的过滤器也会丢失（合并单元格只能保留左上角的单元格信息）

因此，目前要实现多级表头的效果，此前的建议做法是，隐藏table的真实表头，完全使用假表头来实现，这样的好处是，表头完全由普通单元格组成，样式设置，合并单元格非常灵活

但是这样带来的一个问题是table表头自带过滤器就无法使用了，对有过滤需求的用户来说，这样的方案也没法满足需求

这篇教程中，会介绍在保留table标题行的情况下，通过背景色，边框等设置，来实现视觉上的多级合并表头效果。

我们从一个原始的table开始介绍

这个table中，有8列，列头名称不建议修改，修改后会导致table列公式计算错误等问题，我们选择只是把文字颜色设置和背景色一样来隐藏
另外，设置包括标题行和上方2行区域的背景色，要设置为和当前table主题样式中的边框颜色一致，这样才能隐藏表头的边框
具体颜色为rgb(123, 175, 221) 或者说#7bafdd