Layui Table组件,设置data数据源,以及page为False,表格只能显示10条数据的问题

代码如下:

javascript 复制代码
//显示表个数据
        table.render({
            elem: '#' + tableId
            , height: 350
            , page: false // 开启分页
            , skin: 'row' // 行边框风格
            , even: true // 开启隔行背景
            , defaultToolbar: ['filter']
            , toolbar: '#active' //开启工具栏,此处显示默认图标,可以自定义模板,详见文档
            , cols: [[
                {field: 'id', title: 'ID', hide: true},
                {field: 'warehouseName', title: '库位', align: 'center', minWidth: 150},
                {field: 'warehouseReleaseDate', title: '预约出仓日期', align: 'center', width: 300},
                {fixed: 'right', title: '操作', align: 'center', toolbar: '#action', width: 150}
            ]],
            data: tableData,
        });

测试中,发现tableData数据大于10条时,表格依然只展示10条数据。后面查layui文档,才发现即是设置page为false时,外面的limit参数依然生效。

解决方法

增加limit配置即可。

javascript 复制代码
 //显示表个数据
        table.render({
            elem: '#' + tableId
            , height: 350
            , page: false // 开启分页
            , skin: 'row' // 行边框风格
            , even: true // 开启隔行背景
            , defaultToolbar: ['filter']
            , toolbar: '#active' //开启工具栏,此处显示默认图标,可以自定义模板,详见文档
            , cols: [[
                {field: 'id', title: 'ID', hide: true},
                {field: 'warehouseName', title: '库位', align: 'center', minWidth: 150},
                {field: 'warehouseReleaseDate', title: '预约出仓日期', align: 'center', width: 300},
                {fixed: 'right', title: '操作', align: 'center', toolbar: '#action', width: 150}
            ]],
            data: tableData,
            limit: tableData.length
        });
相关推荐
2301_80355452几秒前
实习项目包装--HTTP 协议和 Web API
前端·网络协议·http
lssjzmn1 分钟前
Spring Web 异步响应实战:从 CompletableFuture 到 ResponseBodyEmitter 的全链路优化
java·前端·后端·springboot·异步·接口优化
这里有鱼汤2 分钟前
上班族没时间炒股?不妨试试这个隔夜超短战法(附:Python量化源码)
前端
n12352358 分钟前
Chrome 插件开发入门指南:从基础到实践
前端·chrome
前端 贾公子15 分钟前
ElementUI 中 validateField 对部分表单字段数组进行校验时多次回调问题
前端·javascript·elementui
棒棒的唐16 分钟前
vue2 elementUI 登录页面实现回车提交登录的方法
前端·javascript·elementui
前端小万19 分钟前
一次紧急的现场性能问题排查
前端·性能优化
excel34 分钟前
为什么相同卷积代码在不同层学到的特征完全不同——基于 tfjs-node 猫图像识别示例的逐层解析
前端
知识分享小能手35 分钟前
React学习教程,从入门到精通,React 使用属性(Props)创建组件语法知识点与案例详解(15)
前端·javascript·vue.js·学习·react.js·前端框架·vue
用户214118326360237 分钟前
dify案例分享-免费玩转即梦 4.0 多图生成!Dify 工作流从搭建到使用全攻略,附案例效果
前端