elementplus后el-popover组件不正常显示

最新推荐文章于 2024-06-10 00:37:39 发布

producing

最新推荐文章于 2024-06-10 00:37:39 发布

阅读量808

点赞数 1

分类专栏：基础前端文章标签： vue.js javascript elementui

本文链接：https://blog.csdn.net/qq_49416650/article/details/128351543

版权

基础前端专栏收录该内容

11 篇文章 0 订阅

订阅专栏

这篇博客介绍了如何将ElementUI更新到ElementPlus，并展示了ElementPlus中按钮弹出框的新写法，包括使用虚拟引用和`v-click-outside`指令。文章还提醒读者可以查阅ElementPlus官网获取更多信息。

摘要由CSDN通过智能技术生成

elementui更新到elementplus，

在plus中按钮弹出框已经有新的写法：

<template>
<el-button ref="buttonRef" v-click-outside="onClickOutside"
>Click me</el-button
>

<el-popover
ref="popoverRef"
:virtual-ref="buttonRef"
trigger="click"
title="With title"
virtual-triggering
>
<span> Some content </span>
</el-popover>
</template>

<script setup>
import { ref, unref } from 'vue'
import { ClickOutside as vClickOutside } from 'element-plus'
const buttonRef = ref()
const popoverRef = ref()
const onClickOutside = () => {
unref(popoverRef).popperRef?.delayHide?.()
}
</script>