layui数据解析parseData: function(res)

layui数据解析，后端要写啥？前端又要写啥？
官网https://www.layui.com/doc/modules/table.html#options
一开始看官网看的云里雾里，自己琢磨结合网上的资料终于可以初步使用了，下面是一个具体的使用例子。
依据layui官网的给出的一个data.json，纯前端请求的时候的测试数据，模拟数据库中的数据

{
  "code": 0,
  "msg": "",
  "count": 1000,
  "data": [
    {
      "id": 1001,
      "username": "admin",
      "email": "admin@qq.com",
      "des": "简单的测试",
      "createTime": "2020-07-20 11:11:42",
      "isEffective": "是"
    },
    {
      "id": 1002,
      "username": "test",
      "email": "test2@qq.com",
      "des": "简单的测试2",
      "createTime": "2020-07-20 11:11:42",
      "isEffective": "是"
    }
  ]
}

以下方法都是为了return回去的数据长成上面的样子（少一个字符都不行）

方法一：对list内容不需要转化的数据用这个方法比较简单
后端
@RequestMapping("/admin/getUserInfo")
    @ResponseBody
    public List<User> getUserInfo() {
        List<User> userList = userService.queryAllUser();
        System.out.println(userList);

        return userList;
    }
前端js
,parseData: function(res){ //res 即为原始返回的数据
            return {
                "code": 0, //解析接口状态
                "msg": res.message, //解析提示文本
                "count": res.total, //解析数据长度
                "data": res //解析数据列表
            };
        }

方法二：要转化时间格式等时会简单一些
需要引入json解析的依赖(springboot项目不需要)
 <!-- jackson解析 -->
        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-databind</artifactId>
            <version>2.11.1</version>
        </dependency>
后端
     @RequestMapping("/admin/getUserInfo")
    @ResponseBody
    public String getUserInfo() throws JsonProcessingException {
        List<User> userList = userService.queryAllUser();
        ObjectMapper objectMapper = new ObjectMapper();
        String s = "[";
        for (User user : userList) {
            //Jackson转换Date,Timestamp 到格式化字符串
            objectMapper.setDateFormat(new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"));
            s += objectMapper.writeValueAsString(user);
            s += ",";
        }
        s = s.substring(0, s.length() -1);
        s += "]";
        System.out.println(s);
        return s;
    }

前端js
,parseData: function(res){ //res 即为原始返回的数据
            return {
                "code": 0, //解析接口状态
                "msg": res.message, //解析提示文本
                "count": res.total, //解析数据长度
                "data": res //解析数据列表
            };
        }

方法三：暴力解决，也是一种思路
后端：
    @RequestMapping("/admin/getUserInfo")
    @ResponseBody
    public String getUserInfo() throws JsonProcessingException {
        List<User> userList = userService.queryAllUser();
        ObjectMapper objectMapper = new ObjectMapper();
        String s = "{\n" +
                "  \"code\": 0,\n" +
                "  \"msg\": \"\",\n" +
                "  \"count\": 1000,\n" +
                "  \"data\": [";
        for (User user : userList) {
            s += objectMapper.writeValueAsString(user);
            s += ",";
        }
        s = s.substring(0, s.length() -1);
        s += " ]\n" +
                "}";

        System.out.println(s);
        return s;
    }
前端js
由于这种方法已经在controller层解析完了，格式已经正确，不需要parseData再解析
        

方法有很多，总之想办法让返回的数据和官网给出的格式一致即可

完整的layui使用例子（注意点：使用thymeleaf引擎模板的话需要将cols[[]]中括号分行写，不然的话会被thymeleaf错误解析）
layui.use('table', function() {
    var  table = layui.table
    //用户表
    table.render({
        elem: '#user'
        , height: 420
        , url: '/admin/getUserInfo' //数据接口
        , title: '用户列表'
        , page: true //开启分页
        , toolbar: '#toolbarDemo'  //开启工具栏，添加按钮
        , totalRow: false //开启合计行
        , cellMinWidth: 80 //全局定义常规单元格的最小宽度
        , cols: [
            [ //表头
                {type: 'checkbox', fixed: 'left'}
                , {field: 'id', title: 'ID', sort: true, align: 'center'}
                , {field: 'username', title: '用户名', align: 'center'}
                , {field: 'email', title: '邮箱', align: 'center'}
                , {field: 'des', title: '简介', align: 'center'}
                , {field: 'createTime', title: '创建时间', align: 'center'}
                , {field: 'isEffective', title: '是否可用', templet: '#user-is-effective', align: 'center'}
                , {fixed: 'right', title:'操作', toolbar: '#barDemo', width:140, align: 'center'}
            ]
        ]
        ,parseData: function(res){ //res 即为原始返回的数据
            return {
                "code": 0, //解析接口状态
                "msg": res.message, //解析提示文本
                "count": res.total, //解析数据长度
                "data": res //解析数据列表
            };
        }
    });

});

以上仅供参考