@aliwind/rc-truncate

React component for Alibaba Cloud.

Usage no npm install needed!

<script type="module">
  import aliwindRcTruncate from 'https://cdn.skypack.dev/@aliwind/rc-truncate';
</script>

README

name: rc-truncate zhName: 文本截断 type: biz-component

@aliwind/rc-truncate

用于截断超长文本。

基本用法

比较常见的使用方式： MDXInstruction:importDemo:BasicDemo

根据容器的宽度自动截断： MDXInstruction:importDemo:AutoWidthDemo

在宽度截断模式下，可以截断任何可渲染元素，不只是 string： MDXInstruction:importDemo:NonStringDemo

可以自定义省略符号。不过注意，如果省略符号不是...的话，会在宽度截断模式下造成“字符在中间被截断”（在浏览器中没办法支持那么“智能”的截断）： MDXInstruction:importDemo:CustomOmissionDemo

每当 children 变化的时候，Truncate 会自动检查是否需要截断： MDXInstruction:importDemo:DynamicChildrenDemo

可以自定义 tootip 的 max-width： MDXInstruction:importDemo:TooltipMaxWidthDemo

APIs

MDXInstruction:renderInterface:ITruncateProps