layui表格接口返回格式

首先，最简单的先渲染一个表格，参考官方示例：

layui.use('table', function(){
  var table = layui.table;
 
    table2.render({
      elem: '#demo',
      url: dz+'bisNurseProject/bisNurseProjectList',
      cellMinWidth: 95,
      page: true,
      height: "312",
      limits: [10, 15, 20, 25],
      where: {
        status: $("#status").val(),
      },
      limit: 5,
      id: "userListTable2",
      cols: [[

        { field: 'projectId', title: '项目编号', minWidth: 100, align: "center" },
        { field: 'projectName', title: '项目名称', minWidth: 100, align: "center" },
        { field: 'rmbPrice', title: '人民币售价', minWidth: 100, align: "center" },
        { field: 'manualPrice', title: '手工价格', minWidth: 100, align: "center" },
        { field: 'serverTime', title: '服务时常', minWidth: 100, align: 'center' },
        { field: ' content', title: '项目介绍', minWidth: 100, align: 'center' },
        {
          field: 'status', title: '项目状态', minWidth: 100, align: 'center', templet: function (d) {
            return d.status == '1' ? "在售" : "<span class='layui-red'>下架</span>";
          }
        },
        {
          field: '', title: '选择项目', minWidth: 100, align: 'center', templet: function (d) {
            return '<input type="radio" name="aa"  data-test="' + d.projectId + '"  lay-skin="primary"  data-test2="' + d.projectName + '" data-test3="' + d.rmbPrice + '">';
          }
        }
      ]]
    });
  
});

这里先讲讲一些渲染细节：

1. elem: ‘#demo’ //指定原始表格元素选择器（推荐id选择器）

2. cols：设置表头。值是一个二维数组。方法渲染方式必填

3. url：异步数据接口相关参数。其中 url 参数为必填项

4. page：开启分页（默认：false） 注：从 layui 2.2.0 开始，支持传入一个对象，里面可包含 laypage 组件所有支持的参数（jump、elem除外）

5. limit：每页显示的条数（默认：10）。值务必对应 limits 参数的选项。
   注意：优先级低于 page 参数中的 limit 参数

6. limits：每页条数的选择项，默认：[10,20,30,40,50,60,70,80,90]。
   注意：优先级低于 page 参数中的 limits 参数

7. id：设定容器唯一 id。id 是对表格的数据操作方法上是必要的传递条件，它是表格容器的索引，你在下文诸多地方都将会见识它的存在。

8. 更多参数请参考官网

https://www.layui.com/doc/modules/table.html

cols - 表头参数一览表

参数	类型	说明	示例值
field	String	设定字段名。字段名的设定非常重要，且是表格数据列的唯一标识，要和后台返回的数据字段一致	username
title	String	设定标题名称	用户名
templet	String	自定义列模板，模板遵循 laytpl 语法。这是一个非常实用的功能，你可借助它实现逻辑处理，以及将原始数据转化成其它格式，如时间戳转化为日期字符等	查看官方模板
…	…	…	…

异步数据接口

参数名	功能
url	接口地址。默认会自动传递两个参数：?page=1&limit=30（该参数可通过 request ）page 代表当前页码、limit 代表每页数据量
method	接口http请求类型，默认：get
where	接口的其它参数。如：where: {token: ‘sasasas’, id: 123}
contentType	发送到服务端的内容编码类型。如果你要发送 json 内容，可以设置：contentType: ‘application/json’
headers	接口的请求头。如：headers: {token: ‘sasasas’}
parseData	数据格式解析的回调函数，用于将返回的任意数据格式解析成 table 组件规定的数据格式。table 组件默认规定的数据格式为（参考：/demo/table/user/）： { "code": 0, "msg": "", "count": 1000, "data": [{}, {}]} 很多时候，您接口返回的数据格式并不一定都符合 table 默认规定的格式，比如： { "status": 0, "message": "", "total": 180, "data": { "item": [{}, {}] }} 那么你需要借助 parseData 回调函数将其解析成 table 组件所规定的数据格式 ```table.render({ elem: ‘#demp’ ,url: ‘’,parseData: function(res){ //res 即为原始返回的数据 return { “code”: res.status, //解析接口状态 “msg”: res.message, //解析提示文本 “count”: res.total, //解析数据长度 “data”: res.data.item //解析数据列表 }; } //,…… //其他参数});
request	用于对分页请求的参数：page、limit重新设定名称，如： table.render({ elem: '#demp' ,url: '' ,request: { pageName: 'curr' //页码的参数名称，默认：page ,limitName: 'nums' //每页数据量的参数名，默认：limit } //,…… //其他参数}); 那么请求数据时的参数将会变为：?curr=1&nums=30
response	您还可以借助 response 参数来重新设定返回的数据格式，如： table.render({ elem: '#demp' ,url: '' ,response: { statusName: 'status' //规定数据状态的字段名称，默认：code ,statusCode: 200 //规定成功的状态码，默认：0 ,msgName: 'hint' //规定状态信息的字段名称，默认：msg ,countName: 'total' //规定数据总数的字段名称，默认：count ,dataName: 'rows' //规定数据列表的字段名称，默认：data } //,…… //其他参数}); 那么上面所规定的格式为： 重新规定的数据格式{ "status": 200, "hint": "", "total": 1000, "rows": []}

注意：request 和 response 参数均为 layui 2.1.0 版本新增
调用示例：

//“方法级渲染”配置方式
table.render({ //其它参数在此省略
  url: '/api/data/'
  //where: {token: 'sasasas', id: 123} //如果无需传递额外参数，可不加该参数
  //method: 'post' //如果无需自定义HTTP类型，可不加该参数
  //request: {} //如果无需自定义请求参数，可不加该参数
  //response: {} //如果无需自定义数据响应名称，可不加该参数
}); 
 
等价于（“自动化渲染”配置方式）
<table class="layui-table" lay-data="{url:'/api/data/'}" lay-filter="test"> …… </table>

更多请参考官网

https://www.layui.com/doc/modules/table.html