前言
仅在 Element UI
时有此问题,Element Plus
由于内部结构差异较大,不存在此问题。详见《el-select 差异点,如:高、宽、body插入等》;
问题
- 点击空白处,下拉列表可监听并关闭;
- 但在
Cesium
中无法监听和关闭;
解决方案
- 代码
2
行,初始化时监听 body 单击事件; - 代码
7
行,获取全局下拉列表; - 代码
11 - 14
行,仅当列表显示时,触发click
事件;
// 初始化时监听 body 单击事件
document.getElementsByTagName('body')[0].onclick = () => {
// 获取 el-select
const els = document.querySelectorAll('.el-select');
els.forEach(el => {
// 获取全局下拉列表
const dropdownEls = el.querySelectorAll('.el-select-dropdown');
for (let i = 0; i < dropdownEls.length; i++) {
const dEl = dropdownEls[i];
// 仅对打开的起作用
if (dEl.style.display !== 'none') {
el.click();
break;
}
}
})
};