ThEllipsis文本自动省略号
吴少文 2022/3/8 vue
# ThEllipsis文本自动省略号
文本自动省略号
# 依赖说明
element-ui
# 基本使用
<th-ellipsis text="我是超长的文字哦我是超,但你只能看到5个字" :length="5" />
<th-ellipsis text="我是超长的文字哦我是超" :text-style="{color: 'red'}" tooltip-class="w500" :line="3" tooltip-effect="light" />
# Attributes
| 参数 | 说明 | 类型 | 默认值 | 可选值 | 是否必填 |
|---|---|---|---|---|---|
| text | 文字 | String | '' | -- | 是 |
| textClass | 自定义文字类名 | String | -- | -- | -- |
| textStyle | 自定义文字样式 | Object | -- | -- | -- |
| length | 文本限制长度 | Number | 40 | -- | -- |
| copy | 复制功能,长按复制 | boolean | true | true/false | -- |
| longDelay | 长按时长,单位毫秒 | Number | 1500 | -- | -- |
| tooltip | 文字提示气泡框 | Boolean | true | true/false | -- |
| tooltipEffect | 提示框样式主题 | String | dark | dark/light | -- |
| tooltipClass | 提示框增加指定类名控制提示框的样式 | String | -- | -- | -- |
| tooltipPlacement | 提示框显示位置 | String | bottom | top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end | -- |
# Events
| 事件名称 | 说明 | 回调参数 |
|---|---|---|
| click | 点击事件 | -- |