珠海酒店网站建设公司搜狗竞价

el-select 可搜索多选状态遮挡住搜索框

最近在使用 element-ui 中 el-select组件遇到一个问题，
我们需求可以多选，也可以输入搜索，
当鼠标在边框时才是输入搜索状态，通过下面gif动图可发现鼠标经过边框时，才显示清空图标 并且鼠标无法点中清空图标

经过调试发现，内部的el-select__tag所在 div 充满了整行元素导致鼠标无法聚焦到 input 所在元素，
发现问题就好解决了，
经过一番百度折腾
发现有人说添加pointer-events: none可以解决，抱着试一试的心理试试
给el-select__tag元素添加pointer-events: none发现鼠标能成功聚焦到输入框
问题解决， 提交代码

不久后测试反馈 无法点击 x 号来清空内容了，

啊啊啊啊啊啊！天要塌了

然后又是一番排查，发现 pointer-events: none导致el-tag__close元素事件不起作用，
此时百度pointer-events属性看起作用；

pointer-events

pointer-events 属性用于设置元素是否对鼠标事件做出反应。

看到这里就明白了 只需给 x 号添加pointer-events: auto即可解决

至此问题完美解决

完整代码

.el-select__tags {pointer-events: none;.el-tag__close {pointer-events: auto;}
}