vue枚举类型转换（策略模式）

vue枚举类型转换

• 分析：后端给到我们前端的是一个数字类型的状态码，每一个状态码（1、2）对应有中文我们通过枚举的方式转换成文字即可

1. 可以在methods中定义方法
   例如：

	import EmployeeEnum from '@/constant/employees'

在methods中定义方法
methods: {
    formatEmployment(id) {
      // 对后端返回的类型的编码进行翻译 ，还原成 中文
      const rs = EmployeeEnum.hireType.find(item => item.id === id)
      return rs.value
    },
在模板中使用
<el-table-column label="聘用形式">
            <template slot-scope="scope">
              类型：{{ formatEmployment(scope.row.formOfEmployment) }}
            </template>
          </el-table-column>

• 问题：这种方法对太消耗性能，每次使用都需要循环使用。

2. 推荐方法：我们可以把数组转成 obj:{‘1’:‘value’, ‘2’:‘value’}，然后用obj[“1”]就可以获取到，这样就可以减少性能的消耗。

• 例如：

// 导入枚举信息
import EmployeeEnum from '@/constant/employees'
const hireType = {}
EmployeeEnum.hireType.forEach(item => {
  hireType[item.id] = item.value
})

函数中不再需要find，而直接返回对象的属性值

formatEmployment(id) {
      return hireType[id]
    }

只需要这样就可以实现（策略模式）