element-ui 表格显示时 枚举字段显示的值与数据库字段的值不一致 该如何显示的问题

教师的头衔分为高级讲师和首席讲师两种,但是在数据库中使用0和1进行存储,此时前端该如何显示想要的值?
多种解决方案:
1 简单方式:(这种方式只能实现二选一)

<el-table-column label="头衔" width="80">
     <template slot-scope="scope">
          {{ scope.row.level === 1 ? "高级讲师" : "首席讲师" }}
     </template>
</el-table-column>

2 element提供的方式:
使用element的表格列属性 formatter
https://element.eleme.cn/#/zh-CN/component/table

<el-table-column prop="sex" label="性别" header-align="center" align="center" :formatter="showSex"></el-table-column>
methods: {
    showSex(row, column) {
      // console.log(row)
      if (row.sex === '1') {
        return '雄鸽'
      } else if (row.sex === '2') {
        return '雌鸽'
      } else if (row.sex === '9') {
        return '未鉴别'
      }
    }
  },
posted @ 2020-11-13 16:39  yx袁祥  阅读(2171)  评论(0)    收藏  举报