layui表格解析后台返回的数据

最新推荐文章于 2024-01-09 13:55:07 发布

原创最新推荐文章于 2024-01-09 13:55:07 发布 · 2k 阅读

3 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

前端专栏收录该内容

36 篇文章

订阅专栏

本文介绍了一个使用layui框架实现的表格组件示例，通过HTML和JS代码展示了如何配置和渲染一个包含名称、行业、状态等字段的表格，并对服务器返回的数据进行了解析。

html代码

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

js代码

layui.use('table', function(){
    var table = layui.table;

  table.render({
              elem: '[lay-filter="table_user"]',
              height: 300,
              url:'index.php',
              type: 'GET',
              cols:[[{ field: 'name', title: '名称' },
              { field: 'industry', title: '行业' },
               { field: 'status', title: '状态' },
                { field: 'num', title: '数量' },
                { field: 'price', title: '单价' }
          ]],
              //解析服务器端返回的数据
              parseData: function (res) {
                  /*if (res.code == 500) {
                      return false
                  }*/
                  return {
                      "code":0,
                      "msg":"",
                      "count": 1000,
                      "data": res.result
                  };
              },

          });
  });