Example How to create Tooltips in Vue.js with data attributes
import PopperTooltip from 'tooltip.js';
new Vue({
el: '#app',
mounted() {
document.querySelectorAll('[data-tooltip]').forEach(elem => {
new PopperTooltip(elem, {
placement: elem.dataset.tooltipPlacement || 'top',
title: elem.dataset.tooltip
});
});
}
});
Example How to use it
<p>
<span data-tooltip="I am a tooltip!" data-tooltip-placement="left">
hover over me
</span>
</p>