最近用到了bootstrap table 详细视图,展示字数比较多的字段,经过在网上查找,使用 detailView 实现,只需要做以下配置。

detailView:true,
detailFormatter:function(index,row){
    return  row.content;
}

接下来为了更好的体验,要把详细视图全部展开。

api 上好像没有,在网上找了一个不错的解决办法如下:

onPostBody(data) {
    expand(index);
}

function expand (index){ 
    $("#exampleTable").bootstrapTable('expandAllRows'); 
}

现在是默认全部展开了。

再进一步优化:有的行是没有详细视图的,所以收起没有详细视图的行,展开有详细视图的行。

onPostBody(data) {
    if(data) {
        $.each(data, function(index, item) {
            if(item.commentList && item.commentList.length != 0) {
                expand(index);
            }
        });
    }
}

function expand (index){ 
    $("#exampleTable").bootstrapTable('expandRow', index); 
}

利用 onPostBody 的data参数,循环判断对应index,并在函数中选择性的展开。

ok,完结。
————————————————
版权声明:本文为CSDN博主「the_will_of_god」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/dlutsunmingze/article/details/103345027