LayUI table官方文檔中在介紹復雜表頭時的用例僅使用了自動渲染的方式作為參考,而並未用到方法渲染的方式來做用例,這讓部分不太熟悉layUI table的開發者會有些頭疼,不知道如何在方法渲染中實現復雜表頭,本文將對此做一個簡單的介紹。
在方法渲染中,我們通過在配置clos時對需要使用復雜表頭的列添加相應的配置項owspan,colspan。
配置代碼如下:
cols: [
//一級表頭
[
{ rowspan: 2, title: '聯系人', field: 'person'},
{ rowspan: 2, title: '地址', colspan: 3},
{ rowspan: 2, title: '操作', field: 'option'}
],
//二級表頭
[
{ title: '省', field: 'provence'},
{ title: '市', field: 'city'},
{ title: '區', field: 'area'}
]
],
如上代碼所示,在LayUI中使用方法渲染復雜表頭時,將各級表頭分別放在一個數組中,且按照放置的順序來判斷其級別(一級第一個,二級第二個等等),一般來說,有幾級深度的表頭,那么在第一級中無子級的就需要有相應的rowspan,有子級的,就要有相應的colspan。