table表格合计栏，取小数点后两位。把取到的数字转换成大写汉字

静静湖

已于 2022-06-17 17:55:17 修改

阅读量279

点赞数

文章标签： vue.js elementui 前端

于 2022-06-17 16:47:51 首次发布

本文链接：https://blog.csdn.net/m0_60608114/article/details/125336477

版权

本文介绍如何在Vue.js项目中，结合ElementUI组件库，实现表格数据的合计栏显示小数点后两位，并将这些数字转换为大写的汉字。通过定义一个JS文件处理数字格式化，然后在组件中调用该功能。

摘要由CSDN通过智能技术生成

// 使用summary-method  自定义的合计逻辑。主要是为了显示订单合计金额，并过滤不需要合计的列
    getSummaries(param) {
      const { columns, data } = param
      const sums = []
      columns.forEach((column, index) => {
        // 第一列 显示文字 小计
        if (index === 0) {
          sums[index] = '小计'
          return
        }
        if (index === 2) { // 只针对第3列进行合计
          const values = data.map(item => Number(item[column.property]))
          if (!values.every(value => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr)
              if (!isNaN(value)) {
                return prev + curr
              } else {
                return prev
              }
            }, 0)
            sums[index] = sums[index].toFixed(2) // 保留2位小数，解决小数合计列
          } else {
            sums[index] = '/' // 其余列一律不进行合计
          }
        }
      }