vue/js，如何将下面的代码简洁化？

Question

let resultText;
if(msgData.data === 0){
    resultText = "苹果"
  }
if(msgData.data === 1){
    resultText = "香蕉"
  }
if(msgData.data === 2){
    resultText = "梨子"
  }

如上所示，小弟先谢谢各位大神的解答！

Answer 1

const fruits=["苹果","香蕉","梨子"]

let resultText=fruits[msgData.data]

Answer 2

就是正常的字典思路，可以用数组去完美解决，当然也可以用对象的方式。

数组的方式就是 1 楼的那种，以及一些扩展比如说：

// 状态预设
const dict = [
    { label:'已创建', labelType:"wait" key:0 },
    { label:'申请中', labelType:"process" key:1 },
    { label:'通过审核', labelType:"success"  key:2 },
    // .....
]
// 转换
const getDictValue = function(key){
  const f = dict.find(item => item.key === key)
  return f || status[0]
}

对象的话其实也可以：

const dict = {
 "已创建": { label:'已创建', labelType:"wait", key:0 },
 "申请中": { label:'申请中', labelType:"process", key:1 },
 "通过审核": { label:'通过审核', labelType:"success",  key:2 },
 ...
}
console.log(dict['已创建'])
// {label: '申请中', labelType: 'process', key: 1}

我现在用的比较多的就是两者结合，具体可以看之前我提的一个问题以及一篇笔记

• 项目中前端部分关于订单状态管理的一些疑问
• 项目中的类型和状态管理 | Blog