layui的表格可以动态添加行吗_layui 表格组件中实现动态增加数据行的一种方式...

layui 以界面简洁美观而吸引了不少开发人员，在使用table组件时，需要能编辑表格内容，动态增加数据行。编辑功能组件已支持。但动态增加数据行好像没有支持，网上提供的方式是，获得组件的数据集再加入一个空记录或默认记录，以这个新的数据集作为表格组件的数据源重新渲染表格。

方法是行得通，但毕竟不是原生支持，有局限。因为我用表格组件是来实现在线设计数据库表的，需要动态增加数据行，编辑数据行，如果采用上面的方式就算是刷新，编辑的内容就会丢掉，不符合需求。看了下表格模块的源码，好像单靠扩展还不行，并且要扩展还需要学习下，扩展的语法。直接改源码来得更快些。

源码中有获得后台数据后进行渲染的方法，就以此方法为基础进行提取，单独新建个方法：addData.原渲染方法在727行：

,render = function(){ //后续性能提升的重点

var thisCheckedRowIndex;

....

以此方法为基础，创建一个新的方法，每次增加一行记录.

在54行表格实例中增加对外接口：

,addData:function(record){

that.addData.call(that,record);

}

这样就可以使用了，但只能以表格实例对象调用，不能用table.addData方式调用。如需要还要在table全局接口中注册

实现效果：