一、问题描述:
当弹出框有表格el-table,el-table中有el-select,当滚动滚动条时,el-select的下拉框超出了弹出层
二、问题分析
产生该问题的原因是,滚动表格时,el-select的输入框被隐藏了,但是下拉框el-popper使用的定位方法是fixed,当显示时,使用的z-index非常大,因此显现在最上层,当滚动滚动条往下移动时el-popper并没有被隐藏。
三、解决方案
当表格滚动时,直接隐藏掉下拉框
四、代码
- 获取父级元素,并监听该元素的滚动事件,这里使用的是el-table
- 当父级元素中存在滚动条,则关闭select的下拉框 使用 handleClose
<!--以下代码只有重要步骤 -->
<el-table ref="viewBox">
<el-table-column>
<template slot-scope>
<el-select ref="mySelect0">
</el-select>
<el-select ref="mySelect1">
</el-select>
<el-select ref="mySelect2