基于layui table返回的值的多級嵌套的解決方法
更新時間：2019年09月19日 16:41:57 作者：Accccce
今天小編就為大家分享一篇基于layui table返回的值的多級嵌套的解決方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
我在學(xué)習(xí)layui的過程中遇到了table返回值的問題，如果服務(wù)器端返回給你的數(shù)據(jù)是多級嵌套的話，那你在前臺是解析不了的，在table.js源碼中 它渲染數(shù)據(jù)是用了
data = res[options.response.dataName] || []
這個意味著它源碼不支持嵌套數(shù)據(jù)
舉個例子把 比如服務(wù)器端返回的數(shù)據(jù)中data>dataList>list
把這個數(shù)據(jù)返回給前段解析出來的是 res[data.dataList.list]類似這種的結(jié)構(gòu)，當然解析不了，所以我寫了一個方法處理返回的數(shù)據(jù)
function searchData(response,res,name){
var data = new Object();
var arr = response[name].split("/"),
pre = arr[0];
data[pre] = res[pre];
for(var i = 1;i<arr.length;i++){
if(arr[i]){
var next = arr[i];
data[pre] = data[pre][next];
}
}
然后再table.js中找到ajax下的success中 第一行寫
try{
countNameInfo = response.countName;
dataNameInfo = response.dataName;
//console.log(options.response)
res.newcountName = searchData(response,res,“countName”);
res.newdataName = searchData(response,res,“dataName”);
}catch(err){
console.log(err.message);
}
newcountName，newdataName在pullData中自己定義 之后讓
response.countName = countNameInfo; response.dataName = dataNameInfo;
最后在你table.render中的response中寫
countName: ‘你多級嵌套的節(jié)點值' //數(shù)據(jù)總數(shù)的字段名稱，默認：count ,dataName: ‘你多級嵌套的節(jié)點值' //數(shù)據(jù)列表的字段名稱，默認：data
以上面我寫的例子為例：‘data/dataList/list'
OK 至此你就可以處理多級嵌套的返回值了，如有不對的地方，還望多多包含?。?！
這篇基于layui table返回的值的多級嵌套的解決方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
如何基于JS實現(xiàn)Ajax并發(fā)請求的控制詳解
通常為了減少頁面加載時間,先把核心內(nèi)容顯示處理,頁面加載完成后再發(fā)送ajax請求獲取其他數(shù)據(jù),這時就可能產(chǎn)生多個ajax請求,為了用戶體驗，最好是發(fā)送并行請求,這篇文章主要給大家介紹了關(guān)于如何基于JS實現(xiàn)Ajax并發(fā)請求控制的相關(guān)文章,需要的朋友可以參考下2021-08-08
在平時工作開發(fā)中，大部分開發(fā)人員都花費大量的時間在維護其他人員的代碼。很難從頭開始開發(fā)新代碼，很多情況下都是以他人成果為基礎(chǔ)的，或者新增修改需求，自己寫的代碼也會被其他開發(fā)人員調(diào)用，所以寫好一份高質(zhì)量可維護的代碼就顯得十分重要。2021-05-05
在鴻蒙系統(tǒng)中實現(xiàn)圖片上傳功能,整體流程可以類比為?“選快遞→填單→發(fā)貨→簽收”?的過程,下面給大家介紹鴻蒙系統(tǒng)中實現(xiàn)圖片上傳功能全流程,感興趣的朋友一起看看吧2025-04-04
本文主要介紹了JavaScript樹結(jié)構(gòu)的相關(guān)知識。具有很好的參考價值，下面跟著小編一起來看下吧2017-01-01
ES6知識點整理之函數(shù)數(shù)組參數(shù)的默認值及其解構(gòu)應(yīng)用示例
這篇文章主要介紹了ES6知識點整理之函數(shù)數(shù)組參數(shù)的默認值及其解構(gòu)應(yīng)用,結(jié)合實例形式分析了ES6函數(shù)數(shù)組參數(shù)解構(gòu)賦值和默認值的設(shè)置相關(guān)操作技巧,需要的朋友可以參考下2019-04-04
使用reflect-metadata實現(xiàn)數(shù)據(jù)校驗與日志記錄
在?TypeScript?生態(tài)系統(tǒng)中,reflect-metadata?庫是一種強大的工具,它允許我們在運行時獲取更多的類型信息,下面我們來看看如何在前端項目中使用reflect-metadata以及它能實現(xiàn)的能力吧2024-12-12
這篇文章主要為大家詳細介紹了原生js實現(xiàn)商品篩選，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-10-10
baidu博客的編輯友情鏈接的新的層窗口！經(jīng)典～支持【FF】
baidu博客的編輯友情鏈接的新的層窗口！經(jīng)典～支持【FF】...2007-02-02
簡單了解Javscript中兄弟ifream的方法調(diào)用
這篇文章主要介紹了簡單了解Javscript中兄弟ifream的方法調(diào)用文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，,需要的朋友可以參考下2019-06-06
這篇文章主要介紹了JavaScript常用的工具函數(shù)分享，JavaScript?是一種具有函數(shù)優(yōu)先的輕量級，解釋型或即時編譯型的編程語言，下文詳細介紹需要的小伙伴可以參考一下2022-03-03