下拉框图标变化

奇葩需求 + 奇葩UI = 奇葩的我
需求：点击下拉框，下拉框图标变化，如：

变成这样：

找到对应组件的监听事件，获取到处罚下拉框事件visible-change,回调参数true或者false

<el-select v-model="formDig.qiyeName" placeholder="企业名称" @visible-change="changeIcon">
  <el-option label="项目类型一" value="guangzhou"></el-option>
  <el-option label="项目类型二" value="shenzhen"></el-option>
  <img src="../../assets/releaseProgress/xiala.png" alt="" class="selectIcon" :class="{'isActive': isActive}">
</el-select>
data中定义isActive变量为false
methods: {
	// 监听下拉框
    changeIcon (event) {
      if (event === true) {
        this.isActive = true
      } else {
        this.isActive = false
      }
    },
}
最后在样式里添加isActive类名样式：
.selectIcon {
  position: absolute;
  right: 0px;
  top: 50%;
  &.isActive {
    transform:rotate(270deg);
  }
}

完美收工！

你有多大本事，坐在副驾驶的腿就有多白！