Files
ruoyi-plus-vben5/docs/src/components/common-ui/vben-ellipsis-text.md
Netfan 4fe44611d3 docs: fix docs-link and add EllipsisText docs (#5158)
* docs: fix docs-link and add `EllipsisText` docs

* fix: ellipsisText docs link
2024-12-17 14:41:03 +08:00

1.8 KiB
Raw Blame History

outline
outline
deep

Vben EllipsisText 省略文本

框架提供的文本展示组件可配置超长省略、tooltip提示、展开收起等功能。

如果文档内没有参数说明,可以尝试在在线示例内寻找

基础用法

通过默认插槽设置文本内容,maxWidth属性设置最大宽度。

可折叠的文本块

通过line设置折叠后的行数,expand属性设置是否支持展开收起。

自定义提示浮层

通过名为tooltip的插槽定制提示信息。

API

Props

属性名 描述 类型 默认值
expand 支持点击展开或收起 boolean false
line 文本最大行数 number 1
maxWidth 文本区域最大宽度 number | string '100%'
placement 提示浮层的位置 'bottom'|'left'|'right'|'top' 'top'
tooltip 启用文本提示 boolean true
tooltipBackgroundColor 提示文本的背景颜色 string -
tooltipColor 提示文本的颜色 string -
tooltipFontSize 提示文本的大小 string -
tooltipMaxWidth 提示浮层的最大宽度。如不设置则保持与文本宽度一致 number -
tooltipOverlayStyle 提示框内容区域样式 CSSProperties { textAlign: 'justify' }

Events

事件名 描述 类型
expandChange 展开状态改变 (isExpand:boolean)=>void

Slots

插槽名 描述
tooltip 启用文本提示时,用来定制提示内容