0.1.10 • Published 2 years ago
@weier/w-popover
- 基于第三方vue-js-popover进行修改
- 主要修改点为:优化hover事件,在hover到 popover 的时候,popover 不消失
// 安装
npm i @weier/w-popover -S
// 代码引入(可选)
import Vue from 'vue'
import Popover from '@weier/w-popover'
Vue.use(Popover)
基础用法
<button v-popover:foo>Toggle popover</button>
<popover name="foo">
Hello
</popover>
// or
<button v-popover="{
name: `foo`,
position: 'top'
}">Toggle popover</button>
w-popover Attributes
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|
name | popover名称,唯一 | String | - | |
width | popover宽度 | Number | - | |
transition | 动画名称 -- vuetransition实现模式 | String | - | |
pointer | If set - will show a tiny tip | Boolean | - | |
event | Type of event that will trigger showing of the popover | "click" | "hover" | - | |
delay | Delay in milliseconds | Number | - | |
hoverHideDelay | hover时隐藏延时 | Number | - | 0 |
w-popover Events
事件名称 | 说明 | 参数 |
---|
show | popover显示 | {target: 触发媒介, name: popover name, position: 箭头方向} |
hide | popover消失 | {target: 触发媒介, name: popover name, position: 箭头方向} |
其他
作者:基础建设组-尘寂