el-popover触发元素位置改变后更新弹出框的偏移位置

el-popover的使用如下:包含一个触发元素和一个弹出框元素
el-popover触发元素位置改变后更新弹出框的偏移位置_第1张图片
但是如果触发元素位置发生变化时,如根据弹框选择内容,会显示或隐藏对应的元素,从而导致弹出框触发元素的位置的变化,此时触发元素位置变化了,但是弹出框还在变化之前的位置
正常位置:
el-popover触发元素位置改变后更新弹出框的偏移位置_第2张图片
错误位置:
el-popover触发元素位置改变后更新弹出框的偏移位置_第3张图片

解决
1.给el-popover设置ref属性
el-popover触发元素位置改变后更新弹出框的偏移位置_第4张图片

2.监听导致触发元素位置变化的事件,调用组件updatePopper方法

checkedFilterChange () {
      this.$nextTick(() => {
        this.$refs.filterPopover.updatePopper()
      })
    },

你可能感兴趣的:(vue.js,elementui)