layui-soul-table插件的使用详解

今天发现一款贼舒服的layui数据表格拖拽插件，官方网址：https://soultable.yelog.org/#/zh-CN/component/changelog

将下面模块放入到自己的项目中

soulTable.js 总入口
tableFilter.js 表头筛选
excel.js excel导出
tableChild.js 子表 可单独使用
tableMerge.js 单元格合并 可单独使用

源码版位置：ext 压缩版位置：docs/ext

 

将模块引入项目中

// 自定义模块，这里只需要开放soulTable即可
layui.config({
    base: 'ext/',   // 模块所在目录
}).extend({                         
    soulTable: 'soulTable'  // 模块别名
});

引入 CSS

将 soulTable.css 引入项目 （在项目根目录可找到）

使用

table.render({
    done: function() {
      // 在 done 中开启
      soulTable.render(this)
    }
})

废话不多说，直接上代码：

效果实现：

不懂的小伙伴可以评论留言给我哦！

因为目前该插件仅支持java，所以对于thinkphp5.1来说 筛选功能暂时无法使用，不过小白将会努力的去完善该插件和使用方式，让其在thinkphp5.1中RUN起来，惊奇期待吧