赞
踩
使用layui table组件时,我们会遇到自己后台返回的数据格式和layui table要求的数据结构不同的问题。比如默认的格式是
- {
- "code":"200",
- "msg":"success",
- "count":10
- "data":{
-
- }
- }
而我们实际上后台返回的数据结构是这样的
- {
- "code": "200",
- "message": "成功",
- "data": {
- "page": {
- "index": 1,
- "size": 10,
- "totalItems": 2,
- "items": [{
-
- "creationDatetime": "2019-08-23T16:19:37",
- "completeDatetime": "2019-08-23T16:19:37"
- }, {
-
- "creationDatetime": "2019-08-23T16:15:12",
- "completeDatetime": "2019-08-23T16:15:09"
- }
- ]
- }
- },
- }
没法用,网上有资料说改源码, ,但这样有点麻烦,相信layui的作者也不希望咱们这么干,所以我觉得一定有接口可以修改json格式的,于是再看源码的时候发现parseData
//如果有数据解析的回调,则获得其返回的数据 if(typeof options.parseData === 'function'){ res = options.parseData(res) || res; }
可以看出作者确实留有格式结构转化入口,只要自己自定义回调函数即可;具体配置如下:
- table.render({
- elem: '#dataTable'
- ,toolbar: '#toolbarDemo'
- ,page:true
- ,parseData :parseDataFun //注意这行
- ,id: 'listReload'
- ,url:'http://xxxx.com/info'
- ,where:{phase_name:'canceled'}
- ,cellMinWidth: 80
- ,cols: [ [ ]]
- });
-
- //定义处理数据结构转化的适配器
-
- var parseDataFun = function (res){
- console.log("返回数据 : "+JSON.stringify(res));
- return {
- "code": res.code
- , "message": res.message
- , "data": res.data.page.items
- , "count": res.data.page.total_items
- };
- };
这样就完美的解决了数据结构转化问题。
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。