# Vue版本

[http://element-cn.eleme.io](http://element-cn.eleme.io)


# bootstrap版本

## 后台代码

~~~
@At
@Ok("json:full")
@RequiresAuthentication
public Object data(@Param("length") int length, @Param("start") int start, @Param("draw") int draw, @Param("::order") List<DataTableOrder> order, @Param("::columns") List<DataTableColumn> columns) {
    Cnd cnd = Cnd.NEW();
    return sysLogService.data(length, start, draw, order, columns, cnd, null);
}
~~~

* 记得这里json一定是`full`哦，否则如果有字段为 null 前台 js 会报错

Service类里封装的公共方法：
~~~
//分页查询，linkName为关联对象
NutMap data(int length, int start, int draw, List<DataTableOrder> orders, List<DataTableColumn> columns, Cnd cnd, String linkName);

//带关联对象子查询的分页
NutMap data(int length, int start, int draw, List<DataTableOrder> orders, List<DataTableColumn> columns, Cnd cnd, String linkName, Cnd subCnd);

//自定义SQL分页
NutMap data(int length, int start, int draw, Sql countSql, Sql orderSql);

~~~

## 前台代码

随便打开一个分页页面即可看到代码，这里不贴了~

常见的问题：

* 表格列数和js里的字段数对不上
* datatables.js里对大小写敏感，请前后台字段名大小相一致，特别是自定义sql的时候
