样式 ： pointer-events: none;
<el-form-item label="xxx" prop="saleId" >
<base-selectPage v-model="ruleForm.saleId" :data="subSalesList.length ? subSalesList : salesList" @change="handleSalesId" key-field="id" show-field="code" search-field="searchField" :tb-columns="salesSelectPageColumns">
</base-selectPage>
<div class="saleFlag" v-if="!saleflag" style="pointer-events: none;">
<input v-model='ruleForm.saleName'>
</div>
</el-form-item>
.saleFlag{
position: absolute;
top:0px;
left: 10px;
width:auto;
input{
width: 80px;
border:none;
outline: none;
&:disabled{
background-color: transparent;
}
&:hover{
cursor: pointer;
}
}
}
div.v-selectpage div.sp-input-container div.sp-base > span{ color: #333;}
给div 进行设置 可穿透样式，来触发下层事件的 下拉选择事件