el-popover 组件有一个 teleported 属性默认为 true ,会将弹出框对应的元素插入至 body 元素中,这时弹出框内区域的点击事件就不会冒泡至 vue 应用实例的容器 app 元素上,所以只要给 app 元素注册点击事件就能符合条件; <template> <el-popover placement="bottom-start" :visible="visible" @after-enter="init...
用了两个el-popover。当鼠标浮上弹窗2的时候,弹窗1消失了。 解决办法:给第二个el-popover添加:appendToBody="false",让其插入弹窗1,解决。感谢我可爱的同事帮我解决。我自己还在想着写事件控制啥的 。记录一下。
所以需要写入4个方向: 注意弹出框是动态插入body中的,需写入根部样式中 如果有多个地方用到且颜色都不一样,可以用类名区分,elm提供了 然后把前面的 .el-popper换成自己的类名就可以单独去设置每一个了 代码复制: .el-popper[x-placement^=left] .popper__arrow::after{ border-left-color: #777777; } ....
注意弹出框若是动态插入body中,需写入根部样式中 否则在组件样式中去掉 scoped 复制: .el-popper[x-placement^=left] .popper__arrow::after{ border-left-color: #777777; } .el-popper[x-placement^=right] .popper__arrow::after{ border-right-color: #777777; } .el-popper[x-placement^=bottom] ...
因为会从四个方向不定弹出 所以需要写入4个方向: 注意弹出框若是动态插入body中,需写入根部样式中 否则在组件样式中去掉 scoped 复制: .el-popper[x-placement^=left] .popper__arrow::after{ border-left-color: #7777 ... 转载 4119 阅读 点赞 2 Element...
:append-to-body="true" ref="popover1" placement="top-start" width="220" :visible-arrow="true" trigger="hover" :teleported="false" popper-class="popover" :open-delay="100" @show="showPic(arg)" @hide="popoverPicReset(arg)" > <el-row class="popover_title"> <el-col :span="12" ...