在做需求的時候,我們總是能遇到各種各樣奇葩的需求… o(╯□╰)o
但是呢,依然擋不住一顆探索的心吶!先上展示效果。
需求是這樣的:
在前端上傳檔案後由後端解析成資料再傳回前端做展示,但是傳到前端的資料呢,是一行一行的,但是有些單元格卻是需要合併,因此,後端會返回兩個陣列,乙個陣列是資料,另乙個資料是需要合併的單元格格式,如圖:
cellsdatatable 是後端返回的資料行
mergecell 是需要合併的單元格資訊由於是使用者自己上傳的檔案,行和列都不確定,前端需要動態地展示列標題。
廢話不多說了,上**:
border
ref=
"filetable"
:data
="fileuploaddata"
class
="table-reset"
size
="small"
:span-method
="objectspanmethod"
>
align
='center'
width
="40"
fixed
="left"
type
="selection"
>
el-table-column
>
v-for
="(title, index) in filetitle"
:key
="index"
:prop
="title.name"
:label
="title.name"
align
='center'
>
el-table-column
>
width
="70"
fixed
="right"
label
='選為標題'
>
slot-scope
="scope"
>
class
="cbtn cbtn-yellow"
@click
="ontitle($event, scope.row)"
>
span
>
template
>
el-table-column
>
el-table
>
由於我在前端加了分頁,所以每行的資料需要處理一下
objectspanmethod()
)if(crow && crow.length !==0)
}else}}}},
el table合併單元格
合併單元格對需要合併的 繫結 span method objectspanmethod 在獲取資料後處理資料 與table繫結的陣列 this.mergetablerow table繫結的陣列,要合併的值即某列單元格 categoryid 要合併的值即某列單元格 name 合併單元格 處理函式 me...
el table 合併單元格(絕對好用)
一 有個需求是合併單元格,但是表頭,行資料都是寫活的。前端資料是這樣 tabledata是行資料,tablecolumn是表頭資料,tablecolumn 二 然後介紹如何合併單元格 整理拿到的資料 setdates arr for var i 0,len arr.length i len i 儲存...
合併單元格
青年 老大,最近在 中合併單元格,總是不明就裡,好像是合併對了,有時也是蒙的,您能不能就此指條明路?禪師 這個問題很簡單,合併單元格分為跨行合併和跨列合併,這是標籤的rowspan和colspan屬性問題,已知3x3 禪師 首先說說跨行合併rowspan,由於我們書寫 的習慣是標籤包裹便簽,因此書寫...