el-select中顯示圖標/圖片設置

<template>
<el-select ref="select_icon" v-model="addModel.icon" @change="iconChange">
                <el-option v-for="(item,index) in iconOptions" :key="index" :label="item.label" :value="item.value">
                  <svg-icon :icon-class="item.label" style="float: left;height:100%;" />
                  <span style="float: right; color: #8492a6;">{{ item.value }}</span>
                </el-option>
</template>

export default {

}

iconChange (val) {
      // el-select實際上是兩層div包裹的input
      this.addModel.icon = val;
      // 獲取當前el-select標簽第一層div
      const dom = this.$refs['select_icon'].$el;
      // 創建需要添加到其中的標簽 並填充內容
      const svgDom = document.createElement('span'); // ('<svg-icon ref="iconRef" icon-class="' + val + '" style="float: left;width: 3%;height: 30px;border: 1px solid #dcdfe6;border-right:none;" />');
      svgDom.setAttribute('class', 'el-input__prefix');
      svgDom.innerHTML = '<span class="el-input__prefix-inner"><i class="el-input__icon el-icon-search is-reverse"></i></span>';
      // 將創建的標簽添加到父節點(第二層div)
      dom.children[0].appendChild(svgDom);
      // 得到el-select中的input標簽
      const inputDom = dom.children[0].children[0];
      inputDom.setAttribute('style', 'padding-left: 30px;');
      // 將添加的標簽放到input前面
      dom.children[0].insertBefore(svgDom, inputDom);
    },