layui的table数据匹配问题

Posted 2020-12-10 bklsj

<script>
    layui.use(‘table‘, function () {
        var table = layui.table;
        //第一个实例
        table.render({
            elem: ‘#test‘
            , height: 312
            , url: ‘/Team/GetList‘ //数据接口 默认传递page和limit
            , method: ‘post‘
            , page: true //开启分页
            , limit: 15//每页数据量
            , request: {//传递的参数
                pageName: ‘pageindex‘//修改第一个参数名称，默认page
            }
            //, where: {search:‘a‘} //其他参数
            , parseData: function (res) { //res 即为原始返回的数据
                debugger;
                return {
                    "code": res.code, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.count, //解析数据长度
                    "data": JSON.parse(res.data) //解析数据列表      --------------这里划重点，我就是被坑了一下午----------------
                };
            }
            , cols: [[ //表头
                { field: ‘id‘, title: ‘ID‘, width: 80, sort: true, fixed: ‘left‘ }
                , { field: ‘code‘, title: ‘性别‘, width: 80, sort: true }
                , { field: ‘name‘, title: ‘用户名‘, width: 80 }

                //, { field: ‘city‘, title: ‘城市‘, width: 80 }
                //, { field: ‘sign‘, title: ‘签名‘, width: 177 }
                //, { field: ‘experience‘, title: ‘积分‘, width: 80, sort: true }
                //, { field: ‘score‘, title: ‘评分‘, width: 80, sort: true }
                //, { field: ‘classify‘, title: ‘职业‘, width: 80 }
                //, { field: ‘wealth‘, title: ‘财富‘, width: 135, sort: true }
            ]]
        });

    });
</script>

今天遇到一天的坑，报错什么的。

第一：请求数据不管怎样都会默认加上page(页码)和limit(每页数量)。必须会有2个参数，可以用rquset修改参数名字。添加其他参数可以使用Where。这些官方帮助文档都有的。

第二：返回的数据格式上，不是直接返回data。有默认格式，返回的格式也可以用修改，这就不多说了，官方帮助文档有的。

第三：用parseData接收数据，将数据转换为json对象 Json对象

最后，自己摸索就是蓝受，得费好多时间，不过也是一劳永逸的事!淦，我发现字体缩小不了了，算了

 

 

  <table class="layui-table layui-form" id="test" lay-filter="test"></table>

////////////////////////这是我的后台代码 使用的mvc
/// <summary>
        /// 获取数据列表
        /// </summary>
        /// <param name="pageindex">页码</param>
        /// <param name="limit">每页数量</param>
        /// <returns></returns>
        public ActionResult GetList(int pageindex, int limit)
        {
            TeamBLL manage = new TeamBLL();
            List<team> listTeam = manage.GetList(pageindex,limit);
            var jsonData = new
            {
                code = 0,
                msg = "",
                count = 500,
                data = listTeam.ToJson()
            };
            return Content(jsonData.ToJson());
        }