在这里我们提供 9 种不同方向的展示方式,可以通过以下完整示例来理解,选择你要的效果。

    使用属性来决定hover时的提示信息。由placement属性决定展示效果:placement属性值为:方向-对齐位置;四个方向:topleftrightbottom;三种对齐位置:, end,默认为空。如placement="left-end",则提示信息出现在目标元素的左侧,且提示信息的底部与目标元素的底部对齐。

    Tooltip 组件提供了两个不同的主题:darklight

    通过设置effect属性来改变主题,默认为dark

    展示多行文本或者是设置文本内容的格式

    Tooltip 文字提示 - 图3

    用具名 slot 分发content,替代tooltip中的属性。

    transition 属性可以定制显隐的动画效果,默认为fade-in-linear。如果需要关闭 tooltip 功能,disabled 属性可以满足这个需求,它接受一个Boolean,设置为true即可。

    事实上,这是基于 的扩展,你可以自定义任意 Vue-popper 中允许定义的字段。当然 Tooltip 组件实际上十分强大,文末的API文档会做一一说明。

    tooltip 内不支持 router-link 组件,请使用 vm.$router.push 代替。