基于vue的简单tooltip工具Vtip-Vue的安装与使用

1.安装

npm i vtip -S

2.在main.js文件挂载，用注册指令方式使用，默认指令名称为v-tip。

import Vtip from 'vtip'
import 'vtip/lib/index.min.css'
// 注册指令使用
Vue.use(Vtip.directive)
// 工具函数调用
Vue.prototype.$tip = Vtip.tip

3.在项目中的使用，显示较长文案、或显示图标按钮文字信息。

<el-form-item label="自我评价" prop="selfEvaluation">
   <span class="words" v-tip="detailedDTO.selfEvaluation">{{detailedDTO.selfEvaluation}}</span>
</el-form-item>

<el-button
    type="text"
    size="medium"
    icon="iconfont icon-icon_preview_linear_24"
    @click="preview(item)"
    style="color: #000"
    v-tip.top="'预览'"
></el-button>

4.其他配置信息