对vue表格数据进行格式化—阿拉伯数字转中文

需求

---

<el-table :data="tableData">
  <el-table-column prop="number" label="份数" />     
</el-table>

此时number字段内容只是一个阿拉伯数字，我想作一些转换：

1--->第一份

方法

---

Table-column提供了一个方法

解决

---

我给formatter属性绑定了转换方法toChinesNum

<el-table-column prop="number" label="份数" :formatter="toChinesNum"/>  

接着只需在methods上定义toChinesNum方法：

toChinesNum(row,column){
  let num=row[column.property] //row[column.property]获取字段内容
  
  num = parseInt(num);
  let changeNum = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九']; 
  let unit = ["", "十", "百", "千", "万"];
  let getWan = (temp) => {
    let strArr = temp.toString().split("").reverse();
    let newNum = "";
    for (var i = 0; i < strArr.length; i++) {
      newNum = (i == 0 && strArr[i] == 0 ? "" : (i > 0 && strArr[i] == 0 && strArr[i - 1] == 0 ? "" : changeNum[strArr[i]] + (strArr[i] == 0 ? unit[0] : unit[i]))) + newNum;
    }
    return newNum;
  }
  let overWan = Math.floor(num / 10000);
  let noWan = num % 10000;
  if (noWan.toString().length < 4) noWan = "0" + noWan;
  
  let chinanum=overWan ? getWan(overWan) + "万" + getWan(noWan) : getWan(num);
  return `第${chinanum}份`
},

阿拉伯数字转化为中文数字的方法参考了这篇博文