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}份`
},

阿拉伯數字轉化為中文數字的方法參考了這篇博文