element-ui 在Popover弹框中使用Select选择器_element-plus poppver 中带上 select

背景：
项目需求，在一个弹框中使用选择器，由于项目使用到了element-ui，所以第一时间在element中找到了这两个组件，并进行组合使用，一切都很完美，布局很完美，功能样式也不用进行大的修改。但是，就在我认为大功告成的时候，问题来了。Popover弹框能顺利出现，select选择器也能够正常的选择，但是选择后，不仅select选择器的弹框关闭了，外层的popover弹框也关闭了，what???为什么？
针对问题，找到问题，解决问题！因此，我去看了Popover的关闭逻辑，当点击Popover弹框以外的元素时，弹框就会关闭。但是我的select是写在Popover上的呀，是它的子元素，为啥也会关闭呢？
然后，我就发现，select的option弹框是针对页面元素进行渲染的，我靠，它不是针对父元素渲染。也就是说，select的option弹框不在Popover上，点击这个弹框，也就触发了Popover的关闭条件——点击页面上的其它元素。所以，又没有办法让我们点击这个option时不触发Popover的关闭事件呢？？？我没找到。所以呢，最后呢，当然还是得自己去封装组件了。。。如果你们有办法请告诉我，如果没有，还是老老实实去封装组件吧！！！

附上组件代码：

html:
<div class="yourclass" @click="open">
                    <span v-if=" yourShow'">placeholder</span>
                    <span v-else style="color:rgba(96, 98, 102)">{{ yourdata}}</span>
                    <img src="../assets/img/Shape.png" alt="">
                  </div>
                  <div class="youroption" v-if="optionShow">
                    <ul>
                      <li @click="getoption(item)" v-for="(item,index) in youroptions" :key="index">{{ item }}</li>
                    </ul>
                  </div>
</div>
1
2
3
4
5
6
7
8
9
10
11
12

script:
    data (){
        return {
            yourshow:false,
            yourdata:'',
            youroptions:[],
            optionShow:false
        }
    },
    method:{
        open(){
            this.optionShow=!this.optionShow
        },
        getoption(data){
            this.yourdata=data
            this.optionShow=false
        }
    }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

样式就不给了，自己写哈！！！