## Popover 弹出框 ### 基础用法 Popover 的属性与 Tooltip 很类似,它们都是基于`Vue-popper`开发的,因此对于重复属性,请参考 Tooltip 的文档,在此文档中不做详尽解释。 :::demo 必须设置索引`ref`,在按钮中,我们注册了自定义指令`v-popover`,指向索引ID。`trigger`属性用于设置何时触发 Popover ,提供三种触发方式:`hover`, `click` 和 `focus`。 ```html hover 激活 click 激活 focus 激活 ``` ::: ### 嵌套信息 嵌套表格的例子: :::demo 利用分发取代`content`属性 ```html click 激活 ``` ::: ### 嵌套操作 当然,你还可以嵌套操作,这相比 Dialog 更为轻量: :::demo ```html

这是一段内容这是一段内容确定删除吗?

取消 确定
删除 ``` ::: ### Attributes | 参数 | 说明 | 类型 | 可选值 | 默认值 | |--------------------|----------------------------------------------------------|-------------------|-------------|--------| | trigger | 触发方式 | String | 'click', 'focus', 'hover' | click | | title | 标题 | String | | | | content | 显示的内容,也可以通过 `slot#` 传入 DOM | String | | | | width | 宽度 | String, Number | | 最小宽度 150px | | placement | 出现位置 | String | `top`, `top-start`, `top-end`, `bottom`, `bottom-start`, `bottom-end`, `left`, `left-start`, `left-end`, `right`, `right-start`, `right-end` | bottom | | visible | 初始状态是否可见 | Boolean | | false | | offset | 出现位置的偏移量 | Number | | 0 | | transition | 定义渐变动画 | String | | `fade-in-linear` | | visible-arrow | 是否显示 Tooltip 箭头,更多参数可见[Vue-popper](https://github.com/element-component/vue-popper) | Boolean | | true | | options | [popper.js](https://popper.js.org/documentation.html) 的参数 | Object | 参考 [popper.js](https://popper.js.org/documentation.html) 文档 | `{ boundariesElement: 'body', gpuAcceleration: false }` | ### Slot | 参数 | 说明 | |--- | ---| | - | Popover内嵌HTML文本 |