Element-Ui组件（三十九）Tooltip 文字提示

Element-Ui组件（三十九）Tooltip 文字提示

本文来源于Element官方文档：

http://element-cn.eleme.io/#/zh-CN/component/tooltip

基础用法

普通文字提示

<el-tooltip class="item" effect="dark" content="Top Left 提示文字" placement="top-start">
      <el-button>上左el-button>
    el-tooltip>
    <el-tooltip class="item" effect="dark" content="Top Center 提示文字" placement="top">
      <el-button>上边el-button>
    el-tooltip>
    <el-tooltip class="item" effect="dark" content="Top Right 提示文字" placement="top-end">
      <el-button>上右el-button>
    el-tooltip>

带slot的文字提示

<el-tooltip placement="top">
  <div slot="content">多行信息<br/>第二行信息div>
  <el-button>Top centerel-button>
el-tooltip>

tooltip 内不支持 router-link 组件，请使用 vm.$router.push 代替。
tooltip 内不支持 disabled form 元素，参考MDN，请在 disabled form 元素外层添加一层包裹元素。

Attributes：

参数	类型	说明	可选值	默认值
effect	默认提供的主题	String	dark/light	dark
content	显示的内容，也可以通过 slot#content 传入 DOM	String	—	—
placement	Tooltip 的出现位置	String	top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end	bottom
value(v-model)	状态是否可见	Boolean	—	false
disabled	Tooltip 是否可用	Boolean	—	false
offset	出现位置的偏移量	Number	—	0
transition	定义渐变动画	String	—	el-fade-in-linear
visible-arrow	是否显示 Tooltip 箭头，更多参数可见Vue-popper	Boolean	—	true
popper-options	popper.js 的参数	Object	参考 popper.js 文档	{ boundariesElement: ‘body’, gpuAcceleration: false }
open-delay	延迟出现，单位毫秒	Number	—	0
manual	手动控制模式，设置为 true 后，mouseenter 和 mouseleave 事件将不会生效	Boolean	—	false
popper-class	为 Tooltip 的 popper 添加类名	String	—	—
enterable	鼠标是否可进入到 tooltip 中	Boolean	—	true
hide-after	Tooltip 出现后自动隐藏延时，单位毫秒，为 0 则不会自动隐藏	number	—	0