【vue】过滤器调整element表格的数据（四舍五入，加单位）

问题背景

一般我们将数据显示到element 表格是直接显示的，如下所示：

这里tableData是个数组，数组里面的元素是一个个的字典，长这样：

显示到表格里是这样：

可以看到这里面所有的数据都是从后端传过来直接显示的，但是如果我想进行一些例如四舍五入或者加单位之类的操作呢？这里就可以考虑使用过滤器。

解决方式

过滤器添加在这个位置：

和data数据，methods方法集处于平级位置，然后过滤器可以这么写：

这个过滤器函数叫做rounding，功能是将数值四舍五入到整数

然后页面上修改成这样：

scope.row.tub是每个列对应的数据，我这里乘以100，再使用rounding过滤器进行四舍五入的操作，最后加了一个百分号。

最终表格中的数据显示为结果显示为：