BootstrapTable 点击排序后合并单元格

今天遇到一个问题是需要在点击表头进行排序后合并单元格

查阅bootstraptable 的文档发现方法 onSort可以使用

详细可见：BootstrapTable中文文档_havebeenstand的博客-CSDN博客_bootstraptable

 onSort: function () {
    console.log('点击排序')
    var data = $('#id_table').bootstrapTable('getData', 
    {useCurrentPage:true,includeHiddenRows:true}) //获得本页数据
    var list = []
    for (let val of data){
       list.push(val.build_time)
     }
    var merge_list = timeCheck(list)// 后面是自己写的合并单元格了
    var my_index = 0
    for (value of merge_list) {
       if (value > 1) {
           $('#id_table_pro_details').bootstrapTable('mergeCells', {index: my_index, field:             
           'project_name', colspan: 1, rowspan: value})
       }
       my_index += value
       }
    $('#id_table_pro_details td').css('vertical-align', 'middle')
}

 运行后控制台打断点发现 ，先执行onsort内部自己定义的代码 后执行原型链上的排序 方法BootstrapTable.prototype.onSort   这样就把我合并的的单元格拆分了！

解决方法

用定时器包裹，把合并单元格的操作放到排序之后执行（异步）

即 用setTimeout（）和clearTimeout（）   其中设置时间为0即可，因为排序并没有发送新的请求，不费时间，只是重新渲染table罢了

代码如下：

 onSort: function () {
        if (timeout_flag) {
            clearTimeout(test1)
            timeout_flag = false
            }
        var test1 = setTimeout(function(){
                timeout_flag = true
                var data = $('#id_table_pro_details').bootstrapTable('getData',{useCurrentPage:true,includeHiddenRows:true})
                console.log(data)
                var list = []
                for (let val of data){
                    list.push(val.build_time)
                }
                var merge_list = timeCheck(list)
                var my_index = 0
                for (value of merge_list) {
                    if (value > 1) {
                    $('#id_table_pro_details').bootstrapTable('mergeCells', {index: my_index, field: 'project_name', colspan: 1, rowspan: value})
                    }
                    my_index += value
                    }
                $('#id_table_pro_details td').css('vertical-align', 'middle')
            },0)
            }