feat(Ellipsis): 增加默认 Tooltip 样式 (#739)

WeBankFinTech · Apr 16, 2024 · d546665 · d546665
1 parent cd281e2
commit d546665
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 14 deletions.
diff --git a/components/ellipsis/ellipsis.tsx b/components/ellipsis/ellipsis.tsx
@@ -74,10 +74,17 @@ export default defineComponent({
         });
 
         const toolTipPropsRef = computed(() => {
-            if (isObject(props.tooltip)) {
-                return props.tooltip;
-            }
-            return {};
+            const currentTooltipProps = isObject(props.tooltip)
+                ? props.tooltip
+                : {};
+
+            // 增加默认样式
+            currentTooltipProps.popperStyle = {
+                'max-width': '600px',
+                ...currentTooltipProps.popperStyle,
+            };
+
+            return currentTooltipProps;
         });
 
         // 元素可能是隐藏的，当hover时需要重新计算下

diff --git a/docs/.vitepress/components/ellipsis/index.md b/docs/.vitepress/components/ellipsis/index.md
@@ -12,25 +12,29 @@ app.use(FEllipsis);
 
 ### 基础用法
 
---COMMON
+:::demo
+common.vue
+:::
 
 ### 最大行数
 
---LINE
+:::demo
+line.vue
+:::
 
 ### 定制 Tooltip 内容
 
---TOOLTIP
-
---CODE
+:::demo
+tooltip.vue
+:::
 
 ## Ellipsis Props
 
-| 属性    | 说明                                                                                       | 类型             | 默认值             |
-| ------- | ------------------------------------------------------------------------------------------ | ---------------- | ------------------ |
-| line    | 超出几行后省略                                                                             | string / number  | `1`                |
-| tooltip | 当文本隐藏时，通过`Tooltip`组件展示全部内容，默认延迟 0.5s。 如果`tooltip`为 false，则禁止 | boolean / object | `{showAfter: 500}` |
-| content | 文本内容                                                                                   | string / number  | `-`                |
+| 属性        | 说明                                                                                        | 类型                        | 默认值             |
+|-------------|-------------------------------------------------------------------------------------------|-----------------------------|--------------------|
+| line        | 超出几行后省略                                                                              | `string \| number`          | `1`                |
+| tooltip     | 当文本隐藏时，通过 `Tooltip` 组件<br/>展示全部内容，默认延迟 0.5s。<br/>如果 `tooltip` 为 false，则禁止 | `boolean \| object`         | `{showAfter: 500}` |
+| content     | 文本内容                                                                                    | `string \| number`          | `-`                |
 
 ## Ellipsis Slots