ElementUI 手动控制 popover 弹层的显示与隐藏

ElementUI并没有给我们明确控制popover弹层显示与关闭状态的方法，但是通过ref获取元素之后发现，元素上面已经内置关闭和打开的方法

<el-popover ref="popover"></el-popover>

// 开启 doShow()
this.$refs.popover.doShow();

// 关闭 doClose()
this.$refs.popover.doClose();

设置popover样式

<style src="./portal.scss" lang="scss" scoped></style>
<style lang="scss">
    /* el-popover生成的 div 不在当前组件之内，甚至不在App.vue组件的div内，
    他和App.vue组件的div平级，所以需要设置全局style，全局style又容易污染，最好在命名上做好规范
    这里也不能用穿透符（>>> 或 /deep/ 或 ::v-deep）因为el-popover不在当前组件之内 */
    .portalFilterPopper{
        padding:5px 0;
        min-width: 140px;
        box-sizing: border-box;
        .filterCheckBox{
            .el-checkbox{
                padding:0 12px;
                line-height: 36px;
                display: block;
                margin-right:0;
                &:hover{
                    background: #eff2fa;
                    color: #66b1ff;
                }
            }
        }
    }
</style>