Skip to content

KEllipsis

It can omit your text to a certain extent.

Install

bash
pnpm add @ikun-ui/ellipsis
bash
yarn add @ikun-ui/ellipsis
bash
npm install @ikun-ui/ellipsis

Basic usage

Basic single line ellipsis with tooltip.
content is the text you need to display in the tooltip, text is the text you need to abbreviate.

Omit the number of characters

You can specify the number of words you need to omit through num.

omitted position

placement can specify the position where the ellipsis appears

Omit multiple lines

See caniuse for compatibility.

Ellipsis Props

NameTypeDefaultDescription
contentstring''The text content displayed by tooltip.
textstring''Text content that needs to be omitted.
expandbooleanfalseAbbreviated content trigger event to expand to the full text..
lineClampnumber | nullnullMaximum lines.
numnumber5Number of characters to omit.
placement'left' | 'right' | 'center'rightEllipsis display position.
clsstring''Additional class for component
attrsRecord<string, string>{}Additional attributes

MIT Licensed