elementUI下拉框图片

标签：optionsisAgent obj name elementUI url changeSelection id 下拉框 图片

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;"                 );                 }             }         }

标签：optionsisAgent,obj,name,elementUI,url,changeSelection,id,下拉框,图片
From： https://www.cnblogs.com/zj6666/p/17462660.html