layui 方法渲染表格数据

爱被打了一巴掌 2024-03-31 17:17 109阅读 0赞

layui.use('table', function () {
        const table = layui.table;
        //第一个实例
        table.render({
            elem: '#demo'
            , height: window.screen.height * 0.59
            , url: '/info/list'
            , method: 'post'
            , contentType: "application/json"
            , page: true
            , parseData: function (res) { //res 即为原始返回的数据
                return {
                    code: 0,
                    msg: "",
                    count: res.length,
                    data: res
                };
            }
            , cols: [
                [
                    {field: 'infoId', title: 'ID', width: 80, sort: true, fixed: 'left'}
                    ,{field: 'countryId', title: '国家名称', width: 80 }
                    , {field: 'universityId', title: '用户名', width: 80}
                    , {field: 'directionId', title: '性别', width: 80, }

,{title: '大学英文', width: 170, templet: '<div>{
      {d.university.universityNameEN}}</div>'}

]
            ]
            , text: {none: '无数据'}
        });
    });

--------------------

注意事项

1.  \[ \[\] \]要换行写
2.  layui 有固定的返回格式，parseData声明一下
3.  如大学英文，是对象嵌套对象

发表评论取消回复

表情：

评论列表（有 0 条评论，109人围观）

还没有评论，来说两句吧...

相关阅读

相关 layui 方法渲染表格数据

layui.use('table', function () { const table = layui.table; //第一个实例

爱被打了一巴掌/ 2024年03月31日 17:17/ 0 赞/ 110 阅读

相关 LayUi 之数据表格

我们在平常做项目的过程中，如果想使用数据表格的话，一般都是动态数据的处理，而且一般如果我们数据表格不加分页的话，还是很容易做的，但是加了数据表格的话，如果是前端分页，那也好说，

￡神魔★判官ぃ/ 2022年05月20日 04:27/ 0 赞/ 340 阅读

相关 layui给table表格中加入数据渲染表格

//id为 tableIns的表格数据为rows tableIns.reload({ data: }); 或者

古城微笑少年丶/ 2022年05月12日 11:50/ 0 赞/ 348 阅读

相关《layUI 的数据表格》

1.Action private t_book_vo bookvo = new t_book_vo(); private bookDao_vo bdv =

亦凉/ 2022年04月18日 05:24/ 0 赞/ 497 阅读

相关 layui数据表格：批量删除

前端页面 <form> <input type="button" value="批量删除" class="btn" style="width: 50p

待我称王封你为后i/ 2022年02月13日 06:43/ 0 赞/ 556 阅读

相关 Layui表格渲染

开发工具与关键技术： Visual Studio 2015 – Layui表格渲染作者：廖亚星撰写时间：2019年5 月15 日下面我用Layui插件来渲染代码

缺乏、安全感/ 2022年01月31日 05:49/ 0 赞/ 545 阅读

相关项目总结19：layui实现表格渲染、表格搜索、数据获取

项目总结19：layui实现表格渲染、表格搜索、数据获取 1-参考资料：[https://www.layui.com/demo/table/reload.html][ht

旧城等待，/ 2021年12月22日 03:51/ 0 赞/ 559 阅读

相关 layui数据表格的使用

代码清单 welcom.html <!DOCTYPE html> <html> <head> <meta charset="utf-8

矫情吗；*/ 2021年12月10日 03:35/ 0 赞/ 440 阅读

相关 layui问题之渲染数据表格时，仅出现10条数据

一、问题 ajax获取服务端数据之后，要动态渲染table，但数据仅仅数显了10条，并没有渲染所有的数据。二、经过看一下表格需要的数据，0-9

快来打我*/ 2021年09月14日 13:24/ 0 赞/ 428 阅读

相关 layui数据表格

快速使用创建一个table实例最简单的方式是，在页面放置一个元素 `<table id="demo"></table>`，然后通过 table.render() 方法指

约定不等于承诺〃/ 2021年06月24日 16:11/ 0 赞/ 804 阅读