antd - react table表格需要展示合计行

antd UI框架中table表格本身没有合计行功能需要自己实现，

以下是实现的过程。

1.在设置column时添加序号列，序号为0时显示‘合计’

2.在传data时注意处理下后端返回的total数据

3.这个时候表格显示上会出新问题，因为合计占了一行，导致下面数据展示少了一行，所以需要让pagesize+1

4.因为pageSize在传值的时候多加了1，这样传给后台就又不对了，所以在发送请求之前再重新令pageSize - 1，这样问题就解决了。

新接手的一个项目 是基于ant-design-vue admin的开发，当需求要实现类似elementUI的合计行效果时，发现提供的API不支持，然后写了这个组件，也当练基础了

思路要点有

另外，在实现过程中发现:showHeader="false"这个属性在s-table中不起作用，查看源码发现是props传递的时候出了问题

将s-table组件 render方法中

改为

后解决问题

需求：表格显示合计

效果

1、在table里添加 ref=“table” show-summary summary-method

2、在方法里增加合计方法

   getSummaries(param) {

                const { columns, data } = param

                const sums = []

                columns.forEach((column, index) =>{

                    if (index === 0) {

                        sums[index] = '合计'

                        return

                    }

                    const values = data.map((item) =>Number(item[column.property]))

                    if (column.property === 'JQInsFee' || column.property === 'SYInsFee' || column.property === 'TaxFee') {

                        sums[index] = values.reduce((prev, curr) =>{

                            const value = Number(curr)

                            if (!isNaN(value)) {

                                return Number(Number(prev) + Number(curr)).toFixed(2)

                            } else {

                                return prev

                            }

                        }, 0)

                        sums[index]

                    }

                })

                return sums

            },

3、自定义合计没有效果时是因为table给了固定高度（ps也可以不给固定高度，使用max-height）

   updated() {

              this.$nextTick(() =>{

                this.$refs['table'].doLayout()

            })

---