Fighting Design

Appearance

On this page

Tooltip 消息提示 ​

藏入你的提示内容

基本使用 ​

content 设置弹出的信息内容，position 可以配置不同的弹出方向

开启

不同状态 ​

state 属性可以配置不同的展示状态

开启

没有箭头 ​

no-arrow 可以禁止显示箭头

开启

Attributes ​

参数说明类型可选值默认值
content提示内容string / umber————
position弹出方向TooltipPositiontop bottom right leftbottom
disabled是否禁用boolean——false
state展示状态TooltipStatehover active alwayshover
no-arrow是否显示箭头boolean——false
bold是否加粗文字boolean——false
bright是否使用浅色主题boolean——false
background自定义背景色string————
font-color自定义文字颜色string————

Slots ​

名称说明
default默认插槽

Interface ​

组件导出以下类型定义：

ts
import type {
  TooltipInstance,
  TooltipProps,
  TooltipPosition,
  TooltipState
} from 'fighting-design'

TooltipPosition ​

ts
type TooltipPosition = 'top' | 'bottom' | 'right' | 'left'

TooltipState ​

ts
type TooltipState = 'hover' | 'active' | 'always'

Contributors ​