Skip to content

Tooltip 文字提示

鼠标悬停时显示提示信息,支持四个方位。

基础用法

vue
<template>
  <MTooltip content="这是一段提示文字">
    <button>悬停我</button>
  </MTooltip>
</template>

位置方向

vue
<template>
  <MTooltip content="上方提示" placement="top"><button>top</button></MTooltip>
  <MTooltip content="下方提示" placement="bottom"><button>bottom</button></MTooltip>
  <MTooltip content="左侧提示" placement="left"><button>left</button></MTooltip>
  <MTooltip content="右侧提示" placement="right"><button>right</button></MTooltip>
</template>

Props 属性

属性名类型默认值说明
contentstring-提示文字
placement'top' | 'bottom' | 'left' | 'right''top'出现位置
disabledbooleanfalse禁用提示

Slots 插槽

插槽名说明
default触发提示的元素

Released under the MIT License.