fastadmin的bootstrapTable怎么在表格页脚添加统计功能？

![](https://resource.maoshu.fun/storage/default/20241010/imagefeb4404f6f93b6899136bc7dfd7268ab31fadbcf.png?e=1748801139&token=Ov7mXAv_8azPtTTXXyhh0S5qpDFEhafGpHARTAg2:-arMisB4n0ur1ME6EJvNAB1jcgs=)

> 官方的方法有问题，列数过多的情况下，会有滑块分离现象（上面数据左右滑动，底部页脚不跟着走），下面这是我自己写的方法，能有效解决这个问题。

### 我的方法：
把下面的代码直接复制到表格实例化代码的后面即可。

#### rule里面的规则：
```
title: 列的字段名，指定哪一列显示“合计”两个字；

titleName: “合计” 两个字在这里可以改

sum：里面放数组，指定要合计那些列，只需要把要合计的那些列的列名放这里面即可，不放的不会做统计。

decimal：填整数，保留几位小数
```

监听表格数据渲染完成事件：
`table.on('post-body.bs.table')`

!!! warning 此处为本文章的隐藏内容
需花费 100 积分兑换 或 在下方开通会员解锁。
!!!

### 官方方法：

#### 1.在表格初始化时增加显示页脚 showFooter: true

![](https://resource.maoshu.fun/storage/default/20241010/image834bb25c1d99b2258fa62567991a7414a589db5e.png?e=1748801139&token=Ov7mXAv_8azPtTTXXyhh0S5qpDFEhafGpHARTAg2:x6I9CDiaiRns4r9GqrBBolCF2BY=)

#### 2.在字段后面新增函数 footerFormatter，来显示统计结果

```js
{field: 'id', title: __('Id'),
    footerFormatter: function () {
        return '合计';//对页脚第一列赋：'合计'
    }
},
```

return的返回值，就是你的统计结果，会显示在页脚；所以你只需要在这个函数里计算统计结果，再返回就行了。

例如下面这段：

```js
{field: 'num', title: '测试数字',footerFormatter: function (row) {
    var count = 0;
        for (var i in row) {
            if(row[i].num !=null){
                count += row[i].num;
            }
        }
        return count.toFixed(2);//保留两位小数
}},
```

铜牌 · 会员

解锁全部文章

全部课程8折购买

如果在b站充值了专属会员，可联系猫叔直接开通相同时间的此会员

¥50/年

金牌 · 会员

解锁全部文章

全部课程5折购买

微信一对一答疑

优先解决问题

¥1999/年