涉及的场景:根据后端返回的字段匹配相应的文字,进行页面展示

1. 建一个js文件如:common.js

const enums = {
// 角色
roles: {
    ADMINISTRATOR: '管理人员',
    LEADER: '队长'
  }
}

export {
  enums
  }

2. 在页面直接引入:

html:

    <div class="table-detail">
      <el-table v-loading="loading" :data="list" height="222">
        <el-table-column label="序号" type="index">
          <template slot-scope="scope">
            {{ (pageNum - 1) * pageSize + scope.$index + 1 }}
          </template>
        </el-table-column>
        <el-table-column label="人员分工">
          <template slot-scope="scope">
            {{ enums.roles[scope.row.roles] }}
          </template>
        </el-table-column>
      </el-table>
    </div>

js:

import { enums } from '@/utils/common'

data() {
    return {
      enums: enums
    }
  }
Logo

基于 Vue 的企业级 UI 组件库和中后台系统解决方案,为数万开发者服务。

更多推荐