1、定义数据
optionsisAgent: [ //事项咨询 群众标识
{
id: '1630396469564334081',
name: '高危',
url: require('@/assets/err.png')
},
{
id: '1630396631468662786',
name: '中危',
url: require('@/assets/war.png')
},
{
id: '1630396694752321538',
name: '友善',
url: require('@/assets/scu.png')
},
]
2、option插入图片，label绑定数据url，并定义方法changeSelection
<el-select v-model="elDialogConfig.isAgent" clearable placeholder="请选择群众标识" @change="changeSelection" ref="select">
<el-option v-for="item in optionsisAgent" :key="item.id" :label="item.url" :value="item.name">
<img :src="item.url"/>
</el-option>
</el-select>
3、通过changeSelection修改选项框内的url
changeSelection(e) {
for (let index in this.optionsisAgent) {
let obj = this.optionsisAgent[index];
console.log(obj, e);
if (obj.name == e) {
this.$refs["select"].$el.children[0].children[0].setAttribute(
"style",
"background:url(" +
obj.url +
") no-repeat;color:#fff;text-indent: 9999px;"
);
}
}
}