【element-ui】el-tag设置不同的背景颜色

单独设定el-tag的颜色：由type属性来选择tag的类型，也可以通过color属性来自定义背景色。

vue

<el-tag>标签一</el-tag>
<el-tag type="success">标签二</el-tag>
<el-tag type="info">标签三</el-tag>
<el-tag type="warning">标签四</el-tag>
<el-tag type="danger">标签五</el-tag>

通过v-for循环出的多个el-tag颜色：
通过class进行设置，tag_bg为背景颜色数组

<el-tag
 v-for="(tag, index) in tags"
 :key="index"
  class="tag_bg[index]"
>{{ tag }}
</el-tag>

js
在data里声明颜色数组，有多少tag可以设置几个颜色

data（）{
	return{
		tag_bg: ['bg1', 'bg2', 'bg3', 'bg4', 'bg5']
	}
}

css
在css里对颜色数组进行赋值

	.bg1
      background: #FFF0F5
    .bg2
      background: #F0F8FF
    .bg3
      background: #E6E6FA
    .bg4
      background: #FFEFD5
    .bg5
      background: #FAF0E6