table 元件指定列合併行方法

2021-10-25 14:24:53 字數 837 閱讀 6919

大多數table元件只提供了乙個合併行或者合併列的抽象方法,例如 element ui 元件,

該方法的引數解釋及其用法如下,

看得出來,rowspan代表每一行資料實際占用的行數,colspan代表每一行資料實際占用的列數,我們可以基於原始資料封裝如下方法,

export

const

getspanmethoddata

=(data =

, columns =

)=>

// 用來記住合併列時資料的索引和重複的次數

let pos =

// 用來記錄需要合併的列每次出現重複時,重複的次數

columns.

foreach

(p =>

)for

(let i =

0; i < data.length; i++))

}else

for(

let j =

0; j <= index; j++)if

(obj.curr === obj.prev)

else})

}}return mergecolumns

}

當執行span-method方法的時候,就可以這樣寫,

handlespan()}},

element的table元件,表頭合併

在el table column裡面寫兩個el table column,然後用header cell style將子表頭隱藏 data tabledata span method objectspanmethod header row class name analyse header borde...

js實現table同列的合併

之前每次從後台的list物件在table裡面要合併單元格的時候各種糾結呀,今天想想為何不用js呢 table合併單元格 param tableid table的id param tbodyid tbody的id param tdclass 需要合併的td列class param type 校驗相同的...

Jqeury獲取table當前行與指定列

今天遇到了乙個jqeury獲取table當前行與指定列的問題 大概的實現要求是乙個頁面中,上面有幾個input輸入框,下面有乙個table,當在輸入框中輸入內容的時候,點選新增按鈕的時候,在下面table中追加對應的 同時每行有 編輯 刪除的操作。類似下面的頁面操作 下面是addtable 就是點選...