layui弹出层使用数据表格

话不多说,直接上代码吧

        function popup(result) {
            layui.use('table', function () {
                var table = layui.table;
                layer.open({
                    type: 1,
                    area: ["700px", '430px'],
                    title: "文件下载",
                    maxmin: false,
                    content: '<div><table id="templateTable" lay-filter="templateTable"></table></div>', //先定义一个数据表格的div框
                    success: function (index, layero) {
                        table.render({
                            elem: '#templateTable'
                            , height: 300
                            , width: '100%'
                            , data: result //result格式为[{},{}],此处用的是固定数据,也可以用url来请求后台获取数据,如果使用url要根据layui规定的格式返回才可以渲染上,例：{"code": 0,"msg": "","count": 1000,"data": [{}, {}]} 或者使用parseData进行转化也可以
                            , cols: [[ //设置数据表格表头
                                {checkbox: true} //开启复选框
                                , {field: 'path', title: '文件名称', width: 700, hide: true}
                            ]]
                            , page: true //使用分页
                            , limits: [10, 20, 30, 40, 50, 60, 70, 80, 90, 100] //动态设置每页显示数据的条数
                            , limit: 10 //默认每页多少条
                        });
                        table.on('checkbox(templateTable)', function (obj) { //监听复选框,获取选择到的值
                            let obj_data = obj.data; //获取到选中复选框上的一行数据
                            let path=obj_data.path; //获取某个字段的值
                   
                        })
                    },
                    btn: ['确定', '关闭'],
                    yes: function (index, layero) {
                        layer.close(layer.index); //点击确定之后执行yes函数,关闭弹出层
                    }
                });
            });

        }