vue使用elementui select下拉库组件鼠标hover出现下拉框

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

{{ textSwitch(item.label) }}

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

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