全局常量的统一，及在eleemnt-ui表格中的格式化

在实际项目中遇到很多枚举的常量值，需要统一管理，在表格中需要把对应的值格式化成名称，以此记录：

1.在utils文件夹新建globalData.ts文件，用于存放全局的常量：

const gobalData = {
    gradeList: [{ value: 1, name: '一等奖' }, { value: 2, name: '二等奖' }, { value: 3, name: '三等奖' },
 { value: 4, name: '四等奖' }, { value: 5, name: '五等奖' }, { value: 6, name: '六等奖' }, { value: 7, name: '七等奖' },
 { value: 8, name: '八等奖' }, { value: 9, name: '九等奖' }, { value: 10, name: '十等奖' },],
}
export default gobalData

2.在utils文件夹新建useFormatter.ts文件，对值进行格式化：

import gobalData from './globalData'
export const formatterType=(row: any, key: any, prenatKey: any, val: any)=>{
    // 枚举字段格式化
    let newVal = row ? row[key] : val
    if (!newVal && newVal !== 0) return
    return gobalData[prenatKey].filter((item: any) => item.value == newVal)[0].name || ''
}

3.在组件中使用：

<template>
 <div class="list">
  <el-table v-loading="loading" :data="tableData" row-key="id" border max-height="540px">
   <el-table-column prop="gradeType" label="奖级" align="center"
    :formatter="($event: any) => formatterType($event, 'gradeType', 'gradeList', '')">
   </el-table-column>
   <el-table-column prop="gradeType" label="奖级" align="center">
    <template #default="scope">
     {{ formatterType('', 'gradeType', 'gradeList', scope.row.gradeType)" }}
    </template>
   </el-table-column>
  </el-table>
 </div>
</template>
<script lang="ts" setup>
import { formatterType } from '/@/utils/useFormatter'
import gobalData from '/@/utils/globalData'

</script>
<style lang='postcss' scoped>

</style>