Click to trigger other DOM elements: < $refs, $El >

The effect to be achieved is ：

Click on span, Show the drop-down box select

Structure display ：

<div class="jobCon">
  <a-select ref="selectCom" :value="jobIdItem.name" @change="changeStationName" style="width: 100%;opacity:0" :disabled="isNowOfferApproval">
    <a-select-option :key="item.id">
       <div class="fl">123</div>
    </a-select-option>
  </a-select>
  <span class="name" @click="clickSpan">{
   {jobIdItem.name}}</span>
</div>

 js Exhibition ： It should be noted that , What you currently get selectCom Is it a , If more than one , We need to find the corresponding one , To operate ,$el, except click also select And other trigger events

clickSpan (idx) {
  console.log('=============span', this.$refs.selectCom[idx])
  this.$refs.selectCom[idx].$el.click()
}