官方文档的困惑
首先要说明的是:layui在 table 的工具栏内置了数据导出按钮,如果你是用它内置的导出按钮来导出数据,是没有问题的。但内置的按钮毕竟不太美观,很多时候你可能想通过自己定义的按钮来导出数据,这个时候,我们去参考官方文档,会发现,官方的介绍是非常模糊不清的,请看官方的介绍:
语法:table.exportFile(id, data, type)
代码示例:
var ins1 = table.render({
elem: '#demo'
,id: 'test'
//,…… //其它参数
})
//将上述表格示例导出为 csv 文件
table.exportFile(ins1.config.id, data); //data 为该实例中的任意数量的数据
绝大多数盆友被这个data变量弄懵逼了,如果直接用它,浏览器会无情的提示:“Uncaught ReferenceError: data is not defined”。
其实,官方例子中的这个data变量,应该是表格数据的集合,但是,官方没说清楚这个data数据要从哪里来,以致于很多小伙伴被弄得一头雾水。
解决办法
先看前端界面
例如,我要通过单击上图中的“导出”按钮来导出表格中的所有数据,那么我们在html文件中的代码可以像下面这样写:
<!--工具栏-->
<okToolbar>
<button class="layui-btn" id="addUser">
<i class="iconfont icon-tianjiayonghu1" ></i> 添加