根据参数动态赋值

在utils文件夹下建公用js文件，用来存放静态数据，只需在使用时引入。

export const demo = [
  { label: '全部状态', value: '' },
  { label: 'aaa', value: 1 },
  { label: 'bbb', value: 2 },
  { label: 'ccc', value: 3 },
  { label: 'ddd', value: 4 }
]

<span :class="getColor(xxx)">{{getStatus(xxx)}}</span>

import { demo } from '@/utils/xxxxxxxxx'
getStatus (val) {
  const obj = demo.find(item => item.value === val)
  return obj ? obj.label : ''
},
getColor (val) {
  if ([1, 2, 3, 4].includes(val)) return 'xxx'
  else if ([5, 6, 7, 8].includes(val)) return 'xxxx'
  else return 'xxxxx'
},

这种写法可以少些很多逻辑判断代码，推荐！

这个写法是做新需求的时候看到一个前辈这么写的，感觉很不错，分享一下，每天进步一点点。