layui 表格内容写temple函数_layui表格-template模板的三种用法
問題情境:
layui中將數(shù)據(jù)庫數(shù)據(jù)通過layui table渲染到前端表格,非常簡單,但是如果數(shù)據(jù)庫存儲的信息不能被直接展示,項目中該頁面有好幾個這樣的字段,會員類型,支付類型,會員時長還有平臺類型;例如數(shù)據(jù)庫有一個類型字段:1和2,1表示鉆石會員,2表示至尊會員,前端顯然不能直接顯示1和2,而是應(yīng)該根據(jù)后端返回的數(shù)字進(jìn)行判斷,展示相應(yīng)的內(nèi)容。layui table的自定義模板功能能非常方便地解決這個問題;
方法一:函數(shù)轉(zhuǎn)義
所謂函數(shù)轉(zhuǎn)義,就是在表格cols的對應(yīng)列中直接寫一段函數(shù):
{ field: 'vip_type', title: '會員類型' , templet: function(d) {if(d.vip_type == 1){
res= "鉆石會員"}else{
res= "至尊會員"}returnres;
}
},
這樣的寫法,簡單直接,缺點(diǎn)是復(fù)用性差,有可能導(dǎo)致代碼冗余。
方法二:綁定模板選擇器
下述是templet對應(yīng)的模板,它可以存放在頁面的任意位置。模板遵循于 laytpl 語法,可讀取到返回的所有數(shù)據(jù)。
{{# } else{ }}
至尊會員
{{# } }}
table.render中的對應(yīng)列templet內(nèi)容中直接引用上面的模板即可
{
field:'vip_type',
title:'會員類型',
templet:'#typeTpl'}
這樣的話,如果有多處表格使用同一個模板,代碼復(fù)用性將得到加強(qiáng)。
方法三:直接賦值模版字符
templet: '
{{d.title}}'注意:這里一定要被一層write by:tuantuan
總結(jié)
以上是生活随笔為你收集整理的layui 表格内容写temple函数_layui表格-template模板的三种用法的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 上海欢乐谷三岁儿童项目
- 下一篇: 三亚免税店积分抵现_又变了??三亚免税店