1. mounted 生命周期里去监听 鼠标进入和鼠标移出事件

    this.$refs.mySelect.addEventListener('mouseenter', function () {this.querySelector('.selectel .el-select-dropdown').style.display = 'block'})this.$refs.mySelect.addEventListener('mouseleave', function () {this.querySelector('.selectel .el-select-dropdown').style.display = 'none'})

2. 为了保证鼠标进入打开下拉框,还要保证鼠标进入下拉框不关闭

• template

        <div ref="mySelect"><el-selectclass="selectel"style="float: right"v-model="value"placeholder="请选择"@change="handlechange"><el-optionv-for="item in cities":key="item.value":label="item.label":value="item.value"><i :class="item.icon"></i><span>{{ textSwitch(item.label) }}</span></el-option></el-select></div>

• css input 和下拉框中间有一个间隙鼠标经过也会关闭下拉框

/deep/.el-select-dropdown {margin: 0;padding: 5px 0;
}