判断是不是点击el-drawer的遮罩层
时间: 2023-09-13 11:09:46 浏览: 110
正在查询显示遮罩层
4星 · 用户满意度95%
在el-drawer组件中,遮罩层是一个用于阻止用户直接与页面交互的,点击遮罩层应该不会关闭抽屉。要判断是否点击了el-drawer的遮罩层,可以使用以下代码:
```javascript
const drawerContainer = document.querySelector('.el-drawer__container'); // 获取el-drawer容器元素
drawerContainer.addEventListener('click', (event) => {
// 判断是否点击了遮罩层
if (event.target.classList.contains('el-drawer__mask')) {
// 点击了遮罩层,不做处理
return;
}
// 处理其他情况,如点击了抽屉内容区域
});
```
在上述代码中,`event.target`表示点击的目标元素,`classList.contains('el-drawer__mask')`用于判断目标元素是否包含`el-drawer__mask`类名,如果包含,说明点击了遮罩层,返回即可。如果不包含,则说明点击了抽屉内容区域或其他区域,可以在这里处理相应的操作。
阅读全文