vue-directive-tooltip
经典弹出tip组件

设计非常好,稳定高效,容易上手
有丰富的定制选项,能以命令方式方便的引入到项目中
官方文档清晰明了

演示 Demo
快速起步
cnpm install vue-directive-tooltip --save
/*在.vue中引入*/
<template> <button v-tooltip.right= "{content:'阿珂真漂亮,陈圆圆也好看', offset: 20 , delay: 1000, class: 'tooltip-custom tooltip-other-custom' }" >我能弹出tip</button> </template> <script> import Vue from 'vue'; import Tooltip from 'vue-directive-tooltip'; import 'vue-directive-tooltip/css/index.css'; Vue.use(Tooltip); export default { }; </script> <style> .vue-tooltip.tooltip-custom { color:#fff; background-color: #546E7A; box-shadow: 0 5px 30px rgba(0 , 0 , 0 , .6); padding : 12px 55px; } .vue-tooltip.tooltip-custom .tooltip-arrow { color:#fff; border-color: #546E7A; } </style>