From 8bc9b262f2939c2d30d0af11bf2f135510107ed2 Mon Sep 17 00:00:00 2001 From: neverland Date: Sun, 9 Apr 2023 10:57:34 +0800 Subject: [PATCH] feat(TextEllipsis): add dots prop (#11745) * feat(TextEllipsis): add dots prop * chore: update snap --- packages/vant/src/text-ellipsis/README.md | 1 + packages/vant/src/text-ellipsis/README.zh-CN.md | 13 +++++++------ packages/vant/src/text-ellipsis/TextEllipsis.tsx | 9 +++++---- 3 files changed, 13 insertions(+), 10 deletions(-) diff --git a/packages/vant/src/text-ellipsis/README.md b/packages/vant/src/text-ellipsis/README.md index 08c5d2aaf..c945fb136 100644 --- a/packages/vant/src/text-ellipsis/README.md +++ b/packages/vant/src/text-ellipsis/README.md @@ -91,6 +91,7 @@ export default { | content | The text displayed | _string_ | - | | expand-text | Expand operation text | _string_ | - | | collapse-text | Collapse operation text | _string_ | - | +| dots | Text content of ellipsis | _string_ | `'...'` | ### Events diff --git a/packages/vant/src/text-ellipsis/README.zh-CN.md b/packages/vant/src/text-ellipsis/README.zh-CN.md index f740a6827..d15cb0392 100644 --- a/packages/vant/src/text-ellipsis/README.zh-CN.md +++ b/packages/vant/src/text-ellipsis/README.zh-CN.md @@ -80,12 +80,13 @@ export default { ### Props -| 参数 | 说明 | 类型 | 默认值 | -| ------------- | -------------- | ------------------ | ------ | -| rows | 展示的行数 | _number \| string_ | `1` | -| content | 需要展示的文本 | _string_ | - | -| expand-text | 展开操作的文案 | _string_ | - | -| collapse-text | 收起操作的文案 | _string_ | - | +| 参数 | 说明 | 类型 | 默认值 | +| ------------- | ---------------- | ------------------ | ------- | +| rows | 展示的行数 | _number \| string_ | `1` | +| content | 需要展示的文本 | _string_ | - | +| expand-text | 展开操作的文案 | _string_ | - | +| collapse-text | 收起操作的文案 | _string_ | - | +| dots | 省略号的文本内容 | _string_ | `'...'` | ### Events diff --git a/packages/vant/src/text-ellipsis/TextEllipsis.tsx b/packages/vant/src/text-ellipsis/TextEllipsis.tsx index 775e63a6c..efdd56a0d 100644 --- a/packages/vant/src/text-ellipsis/TextEllipsis.tsx +++ b/packages/vant/src/text-ellipsis/TextEllipsis.tsx @@ -16,6 +16,7 @@ const [name, bem] = createNamespace('text-ellipsis'); export const textEllipsisProps = { rows: makeNumericProp(1), + dots: makeStringProp('...'), content: makeStringProp(''), expandText: makeStringProp(''), collapseText: makeStringProp(''), @@ -69,15 +70,15 @@ export default defineComponent({ container: HTMLDivElement, maxHeight: number ) => { - const { content, expandText } = props; - const dot = '...'; + const { dots, content, expandText } = props; + let left = 0; let right = content.length; let res = -1; while (left <= right) { const mid = Math.floor((left + right) / 2); - container.innerText = content.slice(0, mid) + dot + expandText; + container.innerText = content.slice(0, mid) + dots + expandText; if (container.offsetHeight <= maxHeight) { left = mid + 1; res = mid; @@ -85,7 +86,7 @@ export default defineComponent({ right = mid - 1; } } - return content.slice(0, res) + dot; + return content.slice(0, res) + dots; }; const container = cloneContainer();