这篇文章主要介绍了vue项目中如何添加枚举，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
vue项目添加枚举
添加文件，文件名为enum.js
文件内容：
//使用方法 /** * 获取枚举值：STATUSMAP.SH * 获取枚举描述：STATUSMAP.getDesc('SH') * 通过枚举值获取描述：STATUSMAP.getDescFromValue('TG') */ let STATUSMAP = createEnum({ SH: [0, '审核中'], TG: [1, '审核通过'], }); function createEnum(definition) { const valueMap = {}; const descMap = {}; for (const key of Object.keys(definition)) { const [value, desc] = definition[key]; valueMap[key] = value; descMap[value] = desc; } return { ...valueMap, getDesc(key) { return (definition[key] && definition[key][1]) || '无'; }, getDescFromValue(value) { return descMap[value] || '无'; } } } export default STATUSMAP; 在vue文件中引用
import STATUSMAP from "@/enum";
使用方法
在js中使用
//获取枚举值： STATUSMAP.SH //获取枚举描述： STATUSMAP.getDesc(‘SH') //通过枚举值获取描述： STATUSMAP.getDescFromValue(‘TG')
vue中枚举的使用
涉及的场景：根据后端返回的字段匹配相应的文字，进行页面展示
1. 建一个js文件如：common.js
const enums = { // 角色 roles: { ADMINISTRATOR: '管理人员', LEADER: '队长' } } export { enums }2. 在页面直接引入
html：
{{ (pageNum - 1) * pageSize + scope.$index + 1 }} {{ enums.roles[scope.row.roles] }}
js：
import { enums } from '@/utils/common' data() { return { enums: enums } }以上为个人经验，希望能给大家一个参考，也希望大家多多支持0133技术站。
以上就是vue项目中如何添加枚举的详细内容，更多请关注0133技术站其它相关文章！
