makeit-tooltip
v1.1.2
Published
Makeit Tooltip 气泡浮层组件,基于 Vue3.0 + Vite + JSX 开发,不承载复杂的文本信息,可以替代系统默认的 title 显示。
Downloads
57
Maintainers
Readme
基于 Vue3.0 + Vite 开发的气泡浮层,不承载复杂文本,可以替代系统默认的 title 显示的组件。
关于
Makeit Tooltip 气泡浮层组件,基于 Vue3.0 + Vite + JSX 开发,不承载复杂的文本信息,可以替代系统默认的 title 显示,且能支持更多定制化的样式需求。
安装
npm i makeit-tooltip
使用
import { createApp } from 'vue'
import MakeitTooltip from 'makeit-tooltip'
import 'makeit-tooltip/dist/tooltip.min.css'
import App from './app.vue'
const app = createApp(App)
app.use(MakeitTooltip)
app.mount('#app')
示例
<!-- 基础效果 -->
<template>
<mi-tooltip title="提示信息"></mi-tooltip>
</template>
<!-- 自定义 Title -->
<template>
<mi-tooltip>
<template v-slot:title>
<p>提示信息</p>
</template>
</mi-tooltip>
</template>
<!-- 定制 Trigger 触发事件 -->
<template>
<mi-tooltip title="提示信息" trigger="click"></mi-tooltip>
</template>
<!-- 自定义背景色 -->
<template>
<mi-tooltip title="提示信息" bg-color="#f6ca9d"></mi-tooltip>
</template>
<!-- 自定义字体颜色 -->
<template>
<mi-tooltip title="提示信息" text-color="#f6ca9d"></mi-tooltip>
</template>
更多
更多定制化内容及使用请查看在线示例:https://admin.makeit.vip/components/tooltip