iview UI庫中table的render函式

剛剛接觸乙個專案，一期使用的是iview，檢視文件時發現並未介紹到render函式中類似createelement功能的用法，因此想做乙個相關的分享，希望可以幫到跟我有類似需求的小夥伴們。

iview官方文件中對render是這樣描述的：

自定義渲染列，傳入三個引數 row、column 和 index，分別指當前單元格資料，當前列資料，當前是第幾行，詳見示例

自定義列模板 #

通過給columns資料的項，設定乙個函式render，可以自定義渲染當前列，包括渲染自定義元件。（很強大，下面會講到）

render函式傳入三個引數row、column和index，分別指當前單元格資料，當前列資料，當前是第幾行（其實一般就是第幾條資料）。

render函式本質返回的是字串，table 元件在內部對其進行了編譯，如果使用了自定義元件，需要特別注意上下文，編譯後的自定義元件，預設的上下文是i-table所在的上下文，如果想讓元件在指定的例項下編譯，可以給i-table設定屬性content來指定上下文，比如本例指定當前路由頁為上下文。一般情況不需要此配置，但如果你把i-table作為乙個 slot 封裝在其它元件裡，這時content屬性就很有用，比如父級是 $parent，根元件 $root。

以上這些是官方文件描述和基礎用法，這邊部落格記錄的主要目的是記錄接下來的用法。

語法：render:(h,params)=>{}

具體用法：

render:(h,params) => ，" 元素的內容"/[元素的內容])
}

定義的元素例如：div、span、p等等

元素的性質如：}、、 on: } // 繫結的事件

元素的內容：可以進行標籤的巢狀或者顯示字串的內容

,
style: ,
on: 
}}, '上移'),  // 字串文字
h('button', ,
style: ,
on: 
}}, '下移'),
h('img', ,
})，h('img', ,
})])
}},

Lua中的table函式庫

一部分的table函式只對其陣列部分產生影響,而另一部分則對整個table均產生影響.下面會分開說明.table.concat table,sep,start,end concat是concatenate 連鎖,連線的縮寫.table.concat 函式列出引數中指定table的陣列部分從star...

iview UI庫中table的render函式

Lua中的table函式庫

Lua中的table函式庫

Lua中的table函式庫

相關推薦