【element ui】 el-popover 样式修改不生效解决方法

①基本结构

    
    

        
个人中心
        
退出登录
    
    
    

②问题

在修改el-popover的样式的时候，和往常修改elmentui样式一样就是不起效果。使用::v-deep或者是/deep/样式穿透都没有效果。

③原因

看了一篇博主的博客才得知，原因是 el-popover生成的div不在当前组件之内，甚至不在App.vue组件的div内，他和App.vue组件的div平级。所以需要全局设置style。

④解决办法

官网中提供了一种修改气泡卡片的样式的方式。我们先使用这个方式定义一个类名。然后再用这个使用这个类名去写样式发现气泡卡片样式并没有生效了一些。在百度上查阅了很多人写的解决办法得知要这样使用。写成.el-popover.my-popover-style，后面是我定义的popper-class类名。