layui 的table.render 表格使用

layui是一个强大前端框架

 table 表格就是其中一个实例 

table.render({
    elem: '#data',
    width: 855,
    page: {
        layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip'],
        limit: 10,
        limits: [20,30,50,100,200,5000]
    },
    limit: 10,
    cols: [
        [{
            field: 'name',
            width: 90,
            title: '设备类型',
            unresize: true
        }, {
            field: 'oper',
            title: '操作',
            width: 100,
            fixed: 'right',
            toolbar: '#barTool'
        }]
    ],
    parseData: function (res) {
        console.log('打印数据',res);
        var result;
        if (this.page.curr) {
            result = res.data.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
        }
        else {
            result = res.data.slice(0, this.limit);
        }
        return {
            "code": res.code, //解析接口状态
            "msg": res.msg, //解析提示文本
            "count": res.count, //解析数据长度
            "data": result //解析数据列表
        };
    }
});
table.on('tool(data)', function(obj){
    var data = obj.data; //获得当前行数据
    var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
    var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）
    if(layEvent === 'detail'){ //查看oper
        window.location.href="info?StationID="+data.oper
    }
    return false;
});

上面代码仅供参考：

具体详见官网https://www.layui.com/doc/modules/laypage.html#options