基于layui table返回的值的多级嵌套的解决方法


Posted in Javascript onSeptember 19, 2019

我在学习layui的过程中遇到了table返回值的问题,如果服务器端返回给你的数据是多级嵌套的话,那你在前台是解析不了的,在table.js源码中 它渲染数据是用了

data = res[options.response.dataName] || []

这个意味着它源码不支持嵌套数据

举个例子把 比如服务器端返回的数据中data>dataList>list

把这个数据返回给前段解析出来的是 res[data.dataList.list]类似这种的结构,当然解析不了,所以我写了一个方法处理返回的数据

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: ‘你多级嵌套的节点值' //数据总数的字段名称,默认:count
,dataName: ‘你多级嵌套的节点值' //数据列表的字段名称,默认:data

以上面我写的例子为例:‘data/dataList/list'

OK 至此你就可以处理多级嵌套的返回值了,如有不对的地方,还望多多包含!!!

这篇基于layui table返回的值的多级嵌套的解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery的deferred对象使用详解
Aug 20 Javascript
js函数的引用, 关于内存的开销
Sep 17 Javascript
Extjs4.0设置Ext.data.Store传参的请求方式(默认为GET)
Apr 02 Javascript
javascript 获取模态窗口的滚动位置代码
Aug 06 Javascript
JS获取时间的方法
Jan 21 Javascript
js实现透明度渐变效果的方法
Apr 10 Javascript
jQuery模拟黑客帝国矩阵效果实例
Jun 28 Javascript
原生JS改变透明度实现轮播效果
Mar 24 Javascript
微信小程序 检查接口状态实例详解
Jun 23 Javascript
小程序开发基础之view视图容器
Aug 21 Javascript
Vue 使用iframe引用html页面实现vue和html页面方法的调用操作
Nov 16 Javascript
vue3.0中使用element的完整步骤
Mar 04 Vue.js
layui默认选中table的CheckBox复选框方法
Sep 19 #Javascript
layui 数据表格复选框实现单选功能的例子
Sep 19 #Javascript
基于layui的table插件进行复选框联动功能的实现方法
Sep 19 #Javascript
解决layui的table插件无法多层级获取json数据的问题
Sep 19 #Javascript
Layui数据表格 前后端json数据接收的方法
Sep 19 #Javascript
用原生JS实现爱奇艺首页导航栏代码实例
Sep 19 #Javascript
vue简单练习 桌面时钟的实现代码实例
Sep 19 #Javascript
You might like
一次编写,随处运行
2006/10/09 PHP
从手册去理解分析PHP session机制
2011/07/17 PHP
ueditor 1.2.6 使用方法说明
2013/07/24 PHP
Thinkphp3.2.3整合phpqrcode生成带logo的二维码
2016/07/21 PHP
Zend Framework框架中实现Ajax的方法示例
2017/06/27 PHP
一个收集图片的bookmarlet(js 刷新页面中的图片)
2010/05/27 Javascript
jQuery的实现原理的模拟代码 -5 Ajax
2010/08/07 Javascript
jQuery下的动画处理总结
2013/10/10 Javascript
jQuery避免$符和其他JS库冲突的方法对比
2014/02/20 Javascript
浅谈Javascript中深复制
2014/12/01 Javascript
js计算文本框输入的字符数
2015/10/23 Javascript
使用jQuery给input标签设置默认值
2016/06/20 Javascript
在localStorage中存储对象数组并读取的方法
2016/09/24 Javascript
浅谈ES6新增的数组方法和对象
2017/08/08 Javascript
JS实现预加载视频音频/视频获取截图(返回canvas截图)
2017/10/09 Javascript
详解Node.js中的Async和Await函数
2018/02/22 Javascript
layui数据表格跨行自动合并的例子
2019/09/02 Javascript
vue实现鼠标移过出现下拉二级菜单功能
2019/12/12 Javascript
基于JavaScript实现控制下拉列表
2020/05/08 Javascript
微信小程序实现发微博功能的示例代码
2020/06/24 Javascript
vue - props 声明数组和对象操作
2020/07/30 Javascript
JavaScript数组常用的增删改查与其他属性详解
2020/10/13 Javascript
[14:24]Optic Gaming vs PSG LGD BO3
2018/06/07 DOTA
简析Python的闭包和装饰器
2016/02/26 Python
python导入时小括号大作用
2017/01/10 Python
python交互式图形编程实例(三)
2017/11/17 Python
Python实现两款计算器功能示例
2017/12/19 Python
如何使用 Pylint 来规范 Python 代码风格(来自IBM)
2018/04/06 Python
opencv3/python 鼠标响应操作详解
2019/12/11 Python
python shapely.geometry.polygon任意两个四边形的IOU计算实例
2020/04/12 Python
浅析HTML5的WebSocket与服务器推送事件
2016/02/19 HTML / CSS
英国网络托管和域名领导者:Web Hosting UK
2017/10/15 全球购物
土耳其风格手工珠宝:Ottoman Hands
2019/07/26 全球购物
介绍一下sql server的安全性
2014/08/10 面试题
经典大学生求职信范文
2014/01/06 职场文书
2015年安置帮教工作总结
2015/05/22 职场文书