el-table 中使用formatter格式化数据

司空高义
2023-12-01

formatter这个属性来对传入的数据进行用户自定义的格式化。(比如后台给你返0或1,你需要展示成男”和“女”)  

1.项目表格中使用formatter

<el-table-column label="项目类型" :formatter="formatterType" prop="type"></el-table-column>
methods: {
  formatterType(row){
    switch(row.type){
      case '1':
        return '名称1'
      case '2':
        return '名称2'
      default:
        return '名称3'
    }
  }
},

2.使用v-if做判断

<el-table-column label="项目类型"  prop="type">
  <template slot-scope="scope">
          <span>
            <span v-if="scope.row.type === '1'">名称1</span>
            <span v-if="scope.row.type === '2'">名称2</span>
          </span>
  </template>
</el-table-column>

 类似资料: