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

最新推荐文章于 2024-09-13 09:54:20 发布

记得抬头微笑

最新推荐文章于 2024-09-13 09:54:20 发布

阅读量9.3k

点赞数 3

分类专栏： Element Popover

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/qq_40146638/article/details/106195941

版权

Element 同时被 2 个专栏收录

3 篇文章 0 订阅

订阅专栏

1 篇文章 0 订阅

订阅专栏

场景复现：

在我们需要在列表表头增加筛选条件的时候需要组合使用Table + popover组件，同时增加上table的loading功能，就会出现table显示加载中的状态，而popover的弹层也并没有被关闭，popover的显示状态一般都是由我们手动去触发，开 / 关。

无图无真相：

就会出现这种情况，我这里使用的是click的手动触发，所以出现这种情况时候的解决方案为

<popover ref="popover"></popover>

// ElementUI并没有给我们明确控制popover弹层显示与关闭状态的方法，但是通过ref获取元素之后发现，元素上面已经内置关闭和打开的方法，
// 开启 doShow()   开启调用的方法(一般都是手动触发,不常用)
// 关闭 doClose()  关闭弹层调用的方法(用于刚刚我们说到的场景)

记得抬头微笑

关注

3
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

记得抬头微笑 CSDN认证博客专家 CSDN认证企业博客

码龄7年

54: 原创

1万+: 周排名

107万+: 总排名

16万+: 访问

: 等级

1284: 积分

5953: 粉丝

72: 获赞

65: 评论

335: 收藏

私信

关注

热门文章

分类专栏

作用域 1篇
原生JS 32篇
拖拽 7篇
Promise 8篇
数组 3篇
CSS 3篇
变量 3篇
克隆 1篇
exportExcel 1篇
xlsx 1篇
虚拟滚动
Element 3篇
Message 1篇
验证码
iview 1篇
Popover 1篇
string常用方法 1篇
String
Vue 16篇
局部组件 2篇
全局逻辑控制 1篇
JS 32篇
Model 1篇

最新评论

Vue 插槽 Slot 的数据传递
记得抬头微笑: 抱歉这么久才回复你，最近有点忙，我按照你说的思路试了一下，我发现是 template 的问题，导致 slot 无效，你这里只需要把绑定在 template 上面的 slot 绑定到具体的元素身上就可以正常使用了[code=javascript]<template> <div> <table> <template> <div> <div>table的插件</div> <column> <template> <button slot="default">column得插槽</button> </template> </column> </div> </template> </table> </div> </template> <script> import table from "./table.vue"; import column from "./column.vue"; export default { components: { table, column, }, }; </script> [/code]
Vue 插槽 Slot 的数据传递
阳阳丶Sheep: 请教一个问题，大佬。我有3个组件，app.vue、table.vue、column.vue column的内容是 <tempalte> <div class="column"> <slot name="default" :row=“2”></slot> </div> </template table的内容是 <template> <div class=“header”> <slot name="column"></slot> </div> <div class=“body”></div> </template> app的内容是 <template> <table> <template #column> <column> <template #default> <button>1</button> </template> </column> </template> </table> </template> 想请问下，我怎样才能把 app 里定义的 column 的插槽内容，显示在 table 的 class 为 body 的 div 里。就和 ui 组件库那样可以自定义列内容的，我看了 ui 组件库的逻辑，但是没弄明白。想请教下这块的办法
Vue 实现拖拽模块(四)拖拽元件位置
很棒的名字: 请问html2canvas 插件保存图片最后成功了吗？
Vue 实现拖拽模块(三)自定义拖拽组件的样式
记得抬头微笑: 可以移除，按delete键就可以删掉了
Vue 实现拖拽模块(三)自定义拖拽组件的样式
weixin_46596196: 拖拽后可以移除吗

最新文章

目录

评论 1

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。