vue :formatter 对列的值进行处理

需要对类型进行处理

<el-table size="small" :data="TableData.lists" :header-cell-style="headerStyle" border highlight-current-row style="width: 100%">
      <el-table-column :align="TableData.align" prop="offer_id" label="套餐ID" min-width="200"></el-table-column>
      <el-table-column :align="TableData.align" prop="offer_name" label="套餐名称" min-width="250"></el-table-column>
      <el-table-column :align="TableData.align" prop="price" label="套餐价格" min-width="140"></el-table-column>
      <el-table-column :align="TableData.align" prop="effect_type" label="类型" :formatter="typeFormatter" min-width="180"></el-table-column>
</el-table>

两种方式

• if…else…

typeFormatter: function(row, column) {
        return row.effect_type == 0
          ? "当天有效"
          : row.effect_type == 1
            ? "当月有效"
            : row.effect_type == 2
              ? "季度有效"
              : row.effect_type == 3
                ? "半年有效"
                : row.effect_type == 4
                  ? "1年有效"
                  : row.effect_type == 5
                    ? "本周有效"
                    : row.effect_type == 6 ? "连续包月" : "无限制";
}

• switch…case…

typeFormatter: function(row, column) {
      switch (row.effect_type) {
        case "0":
          return "当天有效";
          break;
        case "1":
          return "当月有效";
          break;
        case "2":
          return "季度有效";
          break;
        case "3":
          return "半年有效";
          break;
        case "4":
          return "1年有效";
          break;
        case "5":
          return "本周有效";
          break;
        case "6":
          return "连续包月";
          break;
        case "9":
          return "已激活";
          break;
      }
}