vue对枚举值转换方式_vue.js_

vue对枚举值转换

最近再做项目中碰到了这样一个问题，前端vue对后端返回数据中的枚举值做处理。之前枚举值的转换都在后端返回dto中做处理，首次碰到这种问题，先将解决方案抛出，希望能帮到有缘人：

注：在 element ui 可以用 formatter 来实现：

如图

stateFormat就是我们将要调用的函数方法，在方法体内写有我们的转译规则，例如：

//转译 stateFormat(data) { if (data.sfjg != null && data.sfjg != "" && data.sfjg == 1) { return "已竣工"; } else if (data.sfjg != null && data.sfjg != "" && data.sfjg == 0) { return "未竣工"; } }, 

方法体中的data默认指的是table当前行的数据（k v格式的），小伙伴们可以console.log(“查看data值”,data)去查看数据，效果图：

到此就结束了

vue中"枚举"的用法

这里的枚举加了引号，并不是真正的枚举，前台经常会遇到用一些数字代表某些状态，数字不知道代表的具体意思，后期维护起来不方便，所以用类似于后台的枚举处理。

vue项目中有很多种枚举的写法和用法，但是使用起来都太麻烦。

下面介绍一种（基于vue+element+admin）

1.在单独的js文件中：test.js

const statustest = {   insert:0,   update:1,   delete:2 }

2.在main.js中添加引用。

3.在vue页面中使用

以上为个人经验，希望能给大家一个参考，也希望大家多多支持。

提示： 本文由神整理自网络，如有侵权请联系本站删除！
本站声明：
1、本站所有资源均来源于互联网，不保证100%完整、不提供任何技术支持；
2、本站所发布的文章以及附件仅限用于学习和研究目的;不得将用于商业或者非法用途；否则由此产生的法律后果，本站概不负责！