Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
[comp: popover]: add component popover
See original GitHub issuePopover API
- I have searched the issues of this repository and believe that this is not a duplicate.
What problem does this feature solve?
弹出浮层显示更详细的信息，又避免使用弹窗这种直接影响用户操作的重量级视图。
What does the proposed API look like?
- 可以手动控制浮层显隐，并有回调；
- 浮层可以选择是否显示标题，并且标题允许用户通过传插槽的形式进行自定义；
- 浮层一定会有内容；
- 浮层可以根据用户配置选择定位对齐位置，并且可以由调用方决定是否需要自动定位；
- 浮层支持多种触发方式；
- 浮层可以由调用方决定是否需要在隐藏时销毁。
何时使用
需要展示一些详细信息，但又不想被弹窗打断当前其他操作。
API
ix-overlay
Props
| 名称 | 说明 | 类型 | 默认值 | 全局配置 | 备注 |
|---|---|---|---|---|---|
title |
浮层的标题 | string | v-slot:title |
- | - | - |
content |
浮层内容 | string | v-slot:default |
- | - | 必传 |
placement |
浮层的对齐方式 | Placement |
top |
✅ | - |
visible |
是否显隐 | boolean |
false |
- | - |
trigger |
浮层触发方式 | OverlayTrigger |
click |
✅ | - |
showDelay |
浮层显示延时 | number |
100 | ✅ | - |
hideDelay |
浮层隐藏延时 | number |
100 | ✅ | - |
destroyOnHide |
隐藏时是否销毁浮层 | boolean |
false |
✅ | - |
autoAdjust |
浮层被遮挡时自动调整位置 | boolean |
true |
✅ | - |
Emits
| 名称 | 说明 | 类型 |
|---|---|---|
visibleChange |
浮层显示隐藏回调 | (visible: boolean) => void |
Issue Analytics
- State:
- Created 3 years ago
- Reactions:1
- Comments:13 (9 by maintainers)
Top Results From Across the Web
Popover | Components - BootstrapVue
The Popover feature provides a tooltip-like behavior, can be easily applied to any interactive element via the component or v-b-popover directive.
Read more >React-Bootstrap Popover Component - GeeksforGeeks
Popover Component is a container-type element that hovers over the parent window. It is just like popup information that is trigger on some ......
Read more >Popovers - Bootstrap
Documentation and examples for adding Bootstrap popovers, like those found in iOS, to any element on your site.
Read more >add popover component #272 - valor-software/ngx-bootstrap
Hi @valorkin! I see the popover component is already available in the github repository and that's great! I would like to know when...
Read more >Angular 2 Component inside bootstrap popover - Stack Overflow
ng2-popover shows angular2 parameters in popover content, but if you were to call a function in there, that function is undefined. For example ......
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
我觉得这种需要展示这么多详细信息的，更适合点击的场景，我目前做的这个需求就是这样。
@danranVm 重新review