<template>
  <div>
    <el-table ref="table" :data="featureCustom2List" height="200" border="true">
      <el-table-column label="圖標(biāo)" prop="prop" width="150" align="center" header-align="center">
        <div class="iconSelect">
          <img :src="`/minigram/${selectedImage}`" v-if="selectedImage" alt="Selected Image" width="20" height="20" />
          <el-select v-model="selectedImage" placeholder="請(qǐng)選擇" @change="iconChange" size="mini" style=" width: 100px;margin-left: 10px;">
          <el-option
            v-for="item in imageList"
            :key="item.id"
            :label="item.iconDesc"
            :value="item.iconAddress"
          >
          <img :src="`/minigram/${item.iconAddress}`"  alt="Selected Image" width="20" height="20">
          <span style="margin-left: 10px;">{{ item.iconDesc }}</span>
          </el-option>
          </el-select>
        </div>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      selectedImage: '',//選中的圖標(biāo)
      featureCustom2List:[],//表格數(shù)據(jù)集合，從接口獲取的數(shù)據(jù)
      imageList:[],//圖標(biāo)數(shù)據(jù)集合，從接口獲取的數(shù)據(jù)
    };
  },
  methods: {
     //監(jiān)聽下拉框
     iconChange(e){
      //下拉框選中的圖標(biāo)進(jìn)行賦值
      this.selectedImage = e
    }
  }
}
</script>