<el-select v-model="value"
:name="'my-select-' + value"
placeholder="请选择">
<el-option
v-for="item in cities"
:key="item.value"
:label="item.label"
:value="item.value">
<span :class="{red: value === 'red',yellow: value === 'yellow',orange: value === 'orange' }">
{{ item.label }}</span>
</el-option>
</el-select>
cities: [{
value: 'yellow',
label: '黄色警报'
}, {
value: 'orange',
label: '橙色警报'
}, {
value: 'red',
label: '红色警报'
}
.el-select [name="my-select-red"] {
color: red;
}
.el-select [name="my-select-orange"] {
color: orange;
}
.el-select [name="my-select-yellow"] {
color: yellow;
}
.el-select [name="my-select-yellow"] {
color: yellow;
}
.el-select-dropdown__item.selected
.red {
color: orange;
}
.el-select-dropdown__item.selected
.yellow {
color: yellow;
}
.el-select-dropdown__item.selected
.orange {
color: orange;
}
参考: