layui 方法渲染表格数据

爱被打了一巴掌 2024-03-31 17:17 132阅读 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 条评论，132人围观）

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

相关阅读

相关 layui 方法渲染表格数据

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

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

相关 layui 表单提交之后渲染表格

layui表单提交之后渲染表格的方法如下： 1. 在表单提交的回调函数中重新渲染表格 2. 在表单提交的回调函数中重新请求表格数据并重新渲染表格示例代码：

àì夳堔傛蜴生んèń/ 2024年03月25日 08:31/ 0 赞/ 87 阅读

相关 LayUi 之数据表格

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

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

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

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

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

相关《layUI 的数据表格》

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

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

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

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

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

相关 Layui表格渲染

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

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

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

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

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

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

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

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

相关 layui数据表格

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

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