Bootstraptable version(s) affected
1.17.1-1.21.2
Description
近期有需求要实现根据页面选择的条件过滤表格中的显示数据,通过遍历每一行的数据做校验,符合条件的使用showRow置为显示,不符合条件的使用hideRow做隐藏。在bootstrap-table 1.11版本中正常,升级至1.17.1和1.21.2均有发现当pagination="client"时,遍历隐藏掉第2条,其余的使用showRow置为显示后,最后一条记录也消失不见了,使用getHiddenRows也查询不到消失的那一行记录。
Example(s)
https://live.bootstrap-table.com/code/Kkunyue/14167
Possible Solutions
调试发现问题是出现在initBody方法中,
{
key: "initBody",
value: function initBody(fixedScroll, updatedUid) {
var _this8 = this;
//**这里获取了包含隐藏行的记录,应该修改为var data = this.getData({includeHiddenRows: false}); **
var data = this.getData();
...........
//**pagination="client"所以不会进入该判断,在隐藏第2行之后,this.pageTo此时变成了data.length-1,即不包含隐藏行的记录数**
if (!this.options.pagination || this.options.sidePagination === 'server') {
this.pageFrom = 1;
this.pageTo = data.length;
}
var rows = [];
var trFragments = $__default["default"](document.createDocumentFragment());
var hasTr = false;
var toExpand = [];
this.autoMergeCells = Utils.checkAutoMergeCells(data.slice(this.pageFrom - 1, this.pageTo));
// **this.pageTo = data.length - 1,所以不会加载到最后一行记录**
for (var i = this.pageFrom - 1; i < this.pageTo; i++) {
var item = data[i];
var tr = this.initRow(item, i, data, trFragments);
hasTr = hasTr || !!tr;
if (tr && typeof tr === 'string') {
.......................
}
}
................
}
}
将上述代码中var data = this.getData();修改为var data = this.getData({includeHiddenRows: false});后又出现新问题,由于在_toggleRow方法中this.initBody(true);的调用是在this.initPagination();调用之前,因此在调用this.initBody(true);时this.pageTo还未减去隐藏掉的那一行,导致this.pageTo==data.length,在初始化最后一行时会出现错误。将this.initBody(true);和this.initPagination();方法调用互换位置之后显示正常,getHiddenRows方法也有同样问题
{
key: "_toggleRow",
value: function _toggleRow(params, visible) {
var row;
................
// **这里将下面两行互换了位置**
//this.initBody(true);
//this.initPagination();
this.initPagination();
this.initBody(true);
}
}