【vue】过滤器调整element表格的数据(四舍五入,加单位)
问题背景一般我们将数据显示到element 表格是直接显示的,如下所示:这里tableData是个数组,数组里面的元素是一个个的字典,长这样:显示到表格里是这样:可以看到这里面所有的数据都是从后端传过来直接显示的,但是如果我想进行一些例如四舍五入或者加单位之类的操作呢?这里就可以考虑使用过滤器。解决方式过滤器添加在这个位置:和data数据,methods方法集处于平级位置,...
·
问题背景
一般我们将数据显示到element 表格是直接显示的,如下所示:
这里tableData是个数组,数组里面的元素是一个个的字典,长这样:
显示到表格里是这样:
可以看到这里面所有的数据都是从后端传过来直接显示的,但是如果我想进行一些例如四舍五入或者加单位之类的操作呢?这里就可以考虑使用过滤器。
解决方式
过滤器添加在这个位置:
和data数据,methods方法集处于平级位置,然后过滤器可以这么写:
这个过滤器函数叫做rounding,功能是将数值四舍五入到整数
然后页面上修改成这样:
scope.row.tub
是每个列对应的数据,我这里乘以100,再使用rounding过滤器进行四舍五入的操作,最后加了一个百分号。
最终表格中的数据显示为结果显示为:
更多推荐
已为社区贡献6条内容
所有评论(0)