1.0.6 • Published 6 years ago
xtooltip v1.0.6
xtooltip
The tooltip component built on Vue.js
Install
npm install xtooltip -S
Usage
import in main.js
import xtooltip from 'xtooltip'
import 'xtooltip/dist/styles/xtooltip.css'
Vue.component('x-tooltip', xtooltip)API
Props
| Attribute | Description | Type | Default |
|---|---|---|---|
| placement | Tooltip position. The value could be top, bottom, left and right. | String | top |
| content | Contents to display. | String or Number | '' |
| trigger | Events to trigger the tooltip. Could be hover, focus and click. | Array | hover |
| visible | Whether to display the tooltip. | Boolean | true |
| showDelay | Delay to show in millisecond. | Number | 100 |
| hideDelay | Delay to hide in millisecond. | Number | 200 |
| offset | Offset of the tooltip relative to its reference. | Number | 0 |
| maxWidth | Maximum width. The text will automatically wrap and be aligned. | Number or String | - |
Events
| Name | Description | Return |
|---|---|---|
| on-show | Emit when tooltip displays. | - |
| on-hide | Emit when tooltip disappear. | - |
Slots
| Name | Description |
|---|---|
| - | Main contents which need to have tooltip. |
| content | The contents of the Tooltip. |