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精华代码集
Jan 24 Javascript
jQuery TextBox自动完成条
Jul 22 Javascript
jquery tools之tooltip
Jul 25 Javascript
Jquery中显示隐藏的实现代码分析
Jul 26 Javascript
jquery 插件开发 extjs中的extend用法小结
Jan 04 Javascript
文件编码导致jquery失效的解决方法
Jun 26 Javascript
jquery查找tr td 示例模拟
May 08 Javascript
Vue-Router2.X多种路由实现方式总结
Feb 09 Javascript
vue学习笔记之Vue中css动画原理简单示例
Feb 29 Javascript
在Webpack中用url-loader处理图片和字体的问题
Apr 28 Javascript
浅谈JavaScript中的“!!”作用
Aug 03 Javascript
vue-cli脚手架的.babelrc文件用法说明
Sep 11 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
如何提高MYSQL数据库的查询统计速度 select 索引应用
2007/04/11 PHP
phpMyAdmin 链接表的附加功能尚未激活问题的解决方法(已测)
2012/03/27 PHP
PHP strtotime函数用法、实现原理和源码分析
2015/02/04 PHP
使两个iframe的高度与内容自适应,且相等
2006/11/20 Javascript
IE下js调试工具Companion.JS
2010/10/15 Javascript
JavaScript访问样式表代码
2010/10/15 Javascript
jquery怎样实现ajax联动框(一)
2013/03/08 Javascript
js将iframe中控件的值传到主页面控件中的实现方法
2013/03/11 Javascript
浅谈JS闭包中的循环绑定处理程序
2014/11/09 Javascript
JS实现同时搜索百度和必应的方法
2015/01/27 Javascript
JavaScript中setUTCFullYear()方法的使用简介
2015/06/12 Javascript
两种JS实现屏蔽鼠标右键的方法
2020/08/20 Javascript
JS实现新浪博客左侧的Blog管理菜单效果代码
2015/10/22 Javascript
javascript实现五星评分功能
2015/11/10 Javascript
JavaScript对象数组排序实例方法浅析
2016/06/15 Javascript
JavaScript中的call和apply的用途以及区别
2017/01/11 Javascript
jquery dialog获取焦点的方法
2017/02/09 Javascript
jQuery实现字体颜色渐变效果的方法
2017/03/29 jQuery
Angular.js中下拉框实现渲染html的方法
2017/06/18 Javascript
nodejs前端自动化构建环境的搭建
2017/07/26 NodeJs
vue教程之toast弹框全局调用示例详解
2020/08/24 Javascript
Nodejs中crypto模块的安全知识讲解
2018/01/03 NodeJs
使用typescript改造koa开发框架的实现
2020/02/04 Javascript
python在windows下实现备份程序实例
2014/07/04 Python
pandas把dataframe转成Series,改变列中值的类型方法
2018/04/10 Python
Django中使用第三方登录的示例代码
2018/08/20 Python
使用Python+wxpy 找出微信里把你删除的好友实例
2019/02/21 Python
python实现爬山算法的思路详解
2019/04/09 Python
Python 2/3下处理cjk编码的zip文件的方法
2019/04/26 Python
python常用函数与用法示例
2019/07/02 Python
一套C#面试题
2013/10/09 面试题
毕业生自我鉴定范文
2013/11/08 职场文书
办理退休介绍信
2014/01/09 职场文书
运动会通讯稿300字
2015/07/20 职场文书
Mysql 设置boolean类型的操作
2021/06/04 MySQL
PHP中多字节字符串操作实例详解
2021/08/23 PHP