layui實(shí)現(xiàn)數(shù)據(jù)表格自定義數(shù)據(jù)項(xiàng)
layui是一個(gè)很適合后臺(tái)開發(fā)人員用的一個(gè)前端框架,界面簡(jiǎn)潔，功能豐富。
大家知道,系統(tǒng)一般都有數(shù)據(jù)表格及分頁(yè)功能，尤其在后臺(tái)管理系統(tǒng)之類，這類場(chǎng)景更是很多，layui也為我們提供了對(duì)應(yīng)的支持，我這里要說(shuō)的是，layui對(duì)異步返回的數(shù)據(jù)默認(rèn)是有一套格式的，像下面這樣
{
code: 0,
msg: "",
count: 1000,
data: []
}
字段的別名我們可以通過(guò)屬性去配置，詳情請(qǐng)參考layui官方文檔
重點(diǎn)來(lái)啦，layui默認(rèn)支持一級(jí)數(shù)據(jù)結(jié)果，像下面這種服務(wù)端返回的數(shù)據(jù)結(jié)構(gòu)是沒(méi)辦法解析到的
{
code: 0,
msg: "",
page: {
totalCount : 1,
list : [
{
id : "1",
name : "2"
}
]
}
}
對(duì)于這樣的多層級(jí)數(shù)據(jù)結(jié)構(gòu)是沒(méi)辦法獲取的，那么如何解決呢？只有修改源碼了
//table.js t[r.countName]) 修改為t['page'][r.countName]) t[r.dataName] 修改為 t['page'][r.dataName])
其中 page為上一層級(jí)的名字，如果有更多層級(jí)，需要同步加上,修改完成之后，在頁(yè)面上的使用可以按照l(shuí)ayui的規(guī)范一樣
以上這篇layui實(shí)現(xiàn)數(shù)據(jù)表格自定義數(shù)據(jù)項(xiàng)就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
在Uniapp中獲取用戶地理位置的實(shí)現(xiàn)方法
本文詳細(xì)介紹了如何在Uniapp中獲取用戶的地理位置,包括申請(qǐng)高德地圖的Key、配置定位功能以及實(shí)現(xiàn)定位功能的代碼示例,感興趣的小伙伴跟著小編一起來(lái)看看吧2025-02-02
Bun運(yùn)行時(shí)是新一代高性能JavaScript/TypeScript運(yùn)行時(shí)
Bun由Jarred Sumner創(chuàng)建,是一款新興的JavaScript和TypeScript運(yùn)行時(shí),旨在比Node.js和Deno提供更高性能和快速啟動(dòng),Bun使用Zig語(yǔ)言編寫,內(nèi)置包管理并支持Node.js大部分API,適用于高并發(fā)API服務(wù)和快速構(gòu)建工具2024-11-11
JavaScript實(shí)現(xiàn)多層顏色選項(xiàng)卡嵌套
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)多層顏色選項(xiàng)卡嵌套，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-09-09
js導(dǎo)出table到excel同時(shí)兼容FF和IE示例
js導(dǎo)出table到excel，在百度可以搜索很多的方法，但是其兼容性是相當(dāng)差的，本文制定了一個(gè)可以同時(shí)兼容FF和IE的方法，感興趣的朋友可以參考下2013-09-09
XP折疊菜單&仿QQ2006菜單...2006-12-12
詳解JavaScript中關(guān)于this指向的4種情況
這篇文章主要介紹了JavaScript中關(guān)于this指向的4種情況，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)工作時(shí)間段選擇，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-02-02
JavaScript實(shí)現(xiàn)簡(jiǎn)易輪播圖最全代碼解析(ES6面向?qū)ο?
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)簡(jiǎn)易輪播圖最全代碼，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-09-09
el-date-picker?限制開始時(shí)間和結(jié)束時(shí)間的代碼實(shí)現(xiàn)
在Vue.js中使用Element?UI庫(kù)的el-date-picker組件時(shí),可以通過(guò)設(shè)置picker-options來(lái)限制開始時(shí)間和結(jié)束時(shí)間的選擇范圍,下面通過(guò)例子介紹el-date-picker?限制開始時(shí)間和結(jié)束時(shí)間的實(shí)現(xiàn),感興趣的朋友一起看看吧2024-08-08
這篇文章主要介紹了JS html事件冒泡和事件捕獲操作,結(jié)合完整實(shí)例形式分析了javascript事件冒泡及事件捕獲相關(guān)原理與實(shí)現(xiàn)方法,需要的朋友可以參考下2019-05-05