# Tooltip文字提示

>  **组件名：**zhuo-Tooltip-Text

### 安装方式

`HBuilderX 2.5.5`，只需将本组件导入项目，在页面`template`中即可直接使用，无需在页面中`import`和注册`components`

**开发不易，如果帮助到你的，请支持 有问题请留言，作者会积极更新**

### 基本用法

```html
<!-- Tooltip文字提示使用示例 -->
<zhuo-Tooltip-Text :content="text2" theme="white" :font-size="14">
    <button>点击或长按显示 Tooltip</button>
</zhuo-Tooltip-Text>
```



### Props

| 参数		| **说明**								| **类型**			| **默认值**	| 可选值	|
| ----------| --------------------------------------| ---------------	| ----------| ------|
| content	| 内容									| 必填 ｜ Stirng		| ''		| 无		|
| theme		| 自定义图标 （App必填）					| 可选 ｜ Stirng		| 'dark'	| dark \ white	|
| fontSize	| 字体大小								| 可选 ｜ Number		| 14		| 0 \	|
| contentStyle	| 卡片内容样式	| 可选 ｜ String	| true		| 无		|
| isLongPress	| 是否长按	| 可选 ｜ Boolean	| false	| false\true	|
| longPressThreshold	| 长按延时触发	| 可选 ｜Number	| 500	| 	|



### Events

无


### Methods

无



###  Slots

| 名称  | **说明**                                                 | 参数                                |
| ----- | -------------------------------------------------------- | ----------------------------------- |
| 默认solt | 默认样式 | 无 |



### 示列代码

### vue2 ｜ vue3 都可

```vue
<template>
    <view class="content">
        <view class="content2">
            <zhuo-Tooltip-Text :content="text2" theme="white" :font-size="14">
                <button>点击或长按显示 Tooltip</button>
            </zhuo-Tooltip-Text>
            
            <view style="margin: 100px 0 0 0">
                项目描述
                <zhuo-Tooltip-Text :content="text2" theme="white" :font-size="14" content-style="color: red;">
                    <span style="color: blue">小丑：</span>
                </zhuo-Tooltip-Text>
                小丑竟然是你
                <zhuo-Tooltip-Text :content="text2" theme="dark" :font-size="14">小帅:</zhuo-Tooltip-Text>
                小帅是你
            </view>
        </view>
    </view>
</template>

<script setup>
const text =
    '四年春，齐侯以诸侯之师侵蔡，蔡溃，遂伐楚。楚子使与师言曰：“君处北海，寡人处南海，唯是风马牛不相及也。不虞君之涉吾地也，何故？”管仲对曰：“昔召康公命我先君大公曰：‘五侯九伯，女实征之，以夹辅周室。’赐我先君履：东至于海，西至于河，南至于穆陵，北至于无棣。尔贡包茅不入，王祭不共，无以缩酒，寡人是徵；昭王南征而不复，寡人是问。”对曰：“贡之不入，寡君之罪也，敢不共给？昭王之不复，君其问诸水滨。';
const text2 = '这是一个自动适配的提示框，内容可以很多也能适配屏幕！';
</script>

<style>
.content2 {
    position: absolute;
    left: 100rpx;
    top: 200rpx;
}
</style>

```

###