diff --git a/components/text/text.tsx b/components/text/text.tsx index 90e99e10..ec02db76 100644 --- a/components/text/text.tsx +++ b/components/text/text.tsx @@ -36,6 +36,10 @@ export default defineComponent({ return { backgroundImage: `linear-gradient(${deg}, ${props.gradient.from}, ${props.gradient.to})`, }; + } else if (typeof props.gradient === 'string') { + return { + color: props.gradient, + }; } return {}; }); diff --git a/docs/.vitepress/components/text/gradient.vue b/docs/.vitepress/components/text/gradient.vue index 524f6a3e..a0c12db9 100644 --- a/docs/.vitepress/components/text/gradient.vue +++ b/docs/.vitepress/components/text/gradient.vue @@ -1,18 +1,15 @@ @@ -28,9 +25,4 @@ const gradientColor2 = { from: '#5384ff', to: '#00cb91', }; - -const color = { - from: '#5384ff', - to: '#5384ff', -}; diff --git a/docs/.vitepress/components/text/index.md b/docs/.vitepress/components/text/index.md index 41739bd8..16f8c02d 100644 --- a/docs/.vitepress/components/text/index.md +++ b/docs/.vitepress/components/text/index.md @@ -43,7 +43,8 @@ mixin.vue ::: ### 颜色渐变 -通过`gradient`,可以设置文字的颜色渐变,纯色则form和to保持一致即可。 + +通过`gradient`,可以设置文字的颜色渐变 :::demo gradient.vue @@ -51,14 +52,14 @@ gradient.vue ## Text Props -| 属性 | 说明 | 类型 | 默认值 | -| -------- | ----------------------------------------------------------- | ------------------ | --------- | -| type | 类型,可选值为`default` `success` `info` `warning` `danger` | `string` | `default` | -| size | 尺寸,可选值为`small` `middle` `large` | `string` | `middle` | -| strong | 是否字体加粗 | `boolean` | `false` | -| italic | 是否字体倾斜 | `boolean` | `false` | -| tag | 自定义元素标签,可选值为`span` `div` `p` `h1` `h2` `h3` 等 | `string` | `span` | -| gradient | 文本渐变色配置 | `Object` | `-` | +| 属性 | 说明 | 类型 | 默认值 | +| -------- | ----------------------------------------------------------- | ------------------------- | --------- | +| type | 类型,可选值为`default` `success` `info` `warning` `danger` | `string` | `default` | +| size | 尺寸,可选值为`small` `middle` `large` | `string` | `middle` | +| strong | 是否字体加粗 | `boolean` | `false` | +| italic | 是否字体倾斜 | `boolean` | `false` | +| tag | 自定义元素标签,可选值为`span` `div` `p` `h1` `h2` `h3` 等 | `string` | `span` | +| gradient | 文本渐变色配置 | `string/Object` | `-` | ## Text Slots @@ -66,10 +67,10 @@ gradient.vue | --------- | -------- | | default | 默认内容 | -## Gradient Props +## Gradient Props -| 属性 | 说明 | 类型 | 默认值 | -| ---- | --------------------------------- | ------------- | ------ | -| from | 起始颜色 | string | `-` | -| to | 结束颜色 | string | `-` | -| deg | 渐变角度,默认为0,即从上之下渐变 | number/string | `0` | \ No newline at end of file +| 属性 | 说明 | 类型 | 默认值 | +| ---- | ---------------------------------- | ------------- | ------ | +| from | 起始颜色 | string | `-` | +| to | 结束颜色 | string | `-` | +| deg | 渐变角度,默认为 0,即从上之下渐变 | number/string | `0` |