layui实现数据表格自定义数据项


Posted in Javascript onOctober 26, 2019

layui是一个很适合后台开发人员用的一个前端框架,界面简洁,功能丰富。

大家知道,系统一般都有数据表格及分页功能,尤其在后台管理系统之类,这类场景更是很多,layui也为我们提供了对应的支持,我这里要说的是,layui对异步返回的数据默认是有一套格式的,像下面这样

{
 code: 0,
 msg: "",
 count: 1000,
 data: []
}

字段的别名我们可以通过属性去配置,详情请参考layui官方文档

重点来啦,layui默认支持一级数据结果,像下面这种服务端返回的数据结构是没办法解析到的

{
 code: 0,
 msg: "",
 page: {
 totalCount : 1,
 list : [
   {
   id : "1",
   name : "2"
   }
  ]
  }
}

对于这样的多层级数据结构是没办法获取的,那么如何解决呢?只有修改源码了

//table.js
t[r.countName]) 修改为t['page'][r.countName])
t[r.dataName] 修改为 t['page'][r.dataName])

其中 page为上一层级的名字,如果有更多层级,需要同步加上,修改完成之后,在页面上的使用可以按照layui的规范一样

以上这篇layui实现数据表格自定义数据项就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript+xml技术实现分页浏览
Jul 27 Javascript
js实现的日期操作类DateTime函数代码
Mar 16 Javascript
jQuery实现列表自动滚动循环滚动展示新闻
Aug 22 Javascript
js查找节点的方法小结
Jan 13 Javascript
Seajs是什么及sea.js 由来,特点以及优势
Oct 13 Javascript
JS 仿支付宝input文本输入框放大组件的实例
Nov 14 Javascript
详解Immutable及 React 中实践
Mar 01 Javascript
在react-router4中进行代码拆分的方法(基于webpack)
Mar 08 Javascript
Vue项目全局配置微信分享思路详解
May 04 Javascript
利用Vue构造器创建Form组件的通用解决方法
Dec 03 Javascript
JS运算符优先级与表达式示例详解
Sep 04 Javascript
再也不怕 JavaScript 报错了,怎么看怎么处理都在这儿
Dec 09 Javascript
layui 数据表格 根据值(1=业务,2=机构)显示中文名称示例
Oct 26 #Javascript
使用 JavaScript 创建并下载文件(模拟点击)
Oct 25 #Javascript
js前端如何写一个精确的倒计时代码
Oct 25 #Javascript
对layui数据表格动态cols(字段)动态变化详解
Oct 25 #Javascript
layui实现数据表格隐藏列的示例
Oct 25 #Javascript
关于在LayUI中使用AJAX提交巨坑记录
Oct 25 #Javascript
浅谈layui 绑定form submit提交表单的注意事项
Oct 25 #Javascript
You might like
php class中self,parent,this的区别以及实例介绍
2013/04/24 PHP
基于PHP实现商品成交时发送短信功能
2016/05/11 PHP
php阳历转农历优化版
2016/08/08 PHP
PHP简单判断iPhone、iPad、Android及PC设备的方法
2016/10/11 PHP
PHP的RSA加密解密方法以及开发接口使用
2018/02/11 PHP
PHP生成腾讯云COS接口需要的请求签名
2018/05/20 PHP
jQuery的一些注意
2006/12/06 Javascript
北京奥运官方网站幻灯切换效果flash版打包下载
2008/01/30 Javascript
ExtJS 2.0实用简明教程之应用ExtJS
2009/04/29 Javascript
Domino中运用jQuery读取视图内容的方法
2009/10/21 Javascript
jQery使网页在显示器上居中显示适用于任何分辨率
2014/06/09 Javascript
Jquery简单实现GridView行高亮的方法
2015/06/15 Javascript
基于BootStrap Metronic开发框架经验小结【六】对话框及提示框的处理和优化
2016/05/12 Javascript
JS实现页面数据无限加载
2016/09/13 Javascript
js使用html2canvas实现屏幕截取的示例代码
2017/08/28 Javascript
微信小程序实现获取小程序码和二维码java接口开发
2019/03/29 Javascript
Jquery实现获取子元素的方法分析
2019/08/24 jQuery
vue开发拖拽进度条滑动组件
2019/09/21 Javascript
Vue中keep-alive组件作用详解
2020/02/04 Javascript
[02:49:21]2019完美盛典全程录像
2019/12/08 DOTA
Python实现统计单词出现的个数
2015/05/28 Python
Python竟能画这么漂亮的花,帅呆了(代码分享)
2017/11/15 Python
OpenCV2.3.1+Python2.7.3+Numpy等的配置解析
2018/01/05 Python
Python中%是什么意思?python中百分号如何使用?
2018/03/20 Python
python3处理含有中文的url方法
2018/05/10 Python
pyqt5 lineEdit设置密码隐藏,删除lineEdit已输入的内容等属性方法
2019/06/24 Python
python中pathlib模块的基本用法与总结
2020/08/17 Python
H5 video poster属性设置视频封面的方法
2020/05/25 HTML / CSS
MATCHESFASHION.COM法国官网:英国奢侈品零售商
2018/01/04 全球购物
家长给老师的道歉信
2014/01/13 职场文书
物理课外活动总结
2014/08/27 职场文书
2016年教师学习廉政准则心得体会
2016/01/20 职场文书
初中地理教学反思
2016/02/19 职场文书
vue2实现provide inject传递响应式
2021/05/21 Vue.js
Pygame Draw绘图函数的具体使用
2021/11/17 Python
Python按顺序遍历并读取文件夹中文件
2022/04/29 Python