diff --git a/packages/components/rate/__tests__/__snapshots__/rate.spec.ts.snap b/packages/components/rate/__tests__/__snapshots__/rate.spec.ts.snap
index 230a4d2c8..00900edba 100644
--- a/packages/components/rate/__tests__/__snapshots__/rate.spec.ts.snap
+++ b/packages/components/rate/__tests__/__snapshots__/rate.spec.ts.snap
@@ -2,11 +2,11 @@
exports[`Rate > render work 1`] = `
""
`;
diff --git a/packages/components/rate/docs/Api.zh.md b/packages/components/rate/docs/Api.zh.md
index e8f8040e0..323a75749 100644
--- a/packages/components/rate/docs/Api.zh.md
+++ b/packages/components/rate/docs/Api.zh.md
@@ -13,5 +13,6 @@
| `disabled` | 禁用状态 | `boolean` | `false` | - | 使用 `control` 时，此配置无效 |
| `icon` | 自定义图标 | `string \| #icon={disabled, focused, index}` | `'star-filled'` | ✅ | - |
| `size` | 设置大小 | `'sm' \| 'md' \| 'lg'` | `'md'` | ✅ | - |
+| `color` | 高亮图标的颜色 | `string` | undefined | - | - |
| `tooltips` | 悬浮提示信息数组 | `string[]` | `[]` | - | - |
| `onChange` | 值发生改变时的回调 | `(value: number) => void` | - | - | - |
diff --git a/packages/components/rate/src/Rate.tsx b/packages/components/rate/src/Rate.tsx
index e510d77e0..4afdb4287 100644
--- a/packages/components/rate/src/Rate.tsx
+++ b/packages/components/rate/src/Rate.tsx
@@ -125,7 +125,7 @@ export default defineComponent({
const itemValue = convertNumber(hoverValue.value ?? accessor.value)
const itemPrefixCls = `${mergedPrefixCls.value}-item`
- const { tooltips } = props
+ const { tooltips, color } = props
const children = []
for (let index = 0; index < count; index++) {
children.push(
@@ -137,6 +137,7 @@ export default defineComponent({
index={index}
prefixCls={itemPrefixCls}
tooltip={tooltips[index]}
+ color={color}
value={itemValue}
onClick={handleItemClick}
onMouseMove={handleItemMouseMove}
diff --git a/packages/components/rate/src/RateItem.tsx b/packages/components/rate/src/RateItem.tsx
index ee7c3b94e..c1467acd9 100644
--- a/packages/components/rate/src/RateItem.tsx
+++ b/packages/components/rate/src/RateItem.tsx
@@ -43,11 +43,11 @@ export default defineComponent({
})
return () => {
- const { count, disabled, index, prefixCls, tooltip, value } = props
+ const { count, disabled, index, prefixCls, tooltip, value, color } = props
const iconNode = slots.default!()
const itemNode = (
-
+
index}
aria-posinset={index + 1}
diff --git a/packages/components/rate/src/types.ts b/packages/components/rate/src/types.ts
index d1878a03d..96767ebd6 100644
--- a/packages/components/rate/src/types.ts
+++ b/packages/components/rate/src/types.ts
@@ -33,6 +33,10 @@ export const rateProps = {
default: (): string[] => [],
},
size: String as PropType,
+ color: {
+ type: String,
+ default: undefined,
+ },
// events
'onUpdate:value': [Function, Array] as PropType void>>,
@@ -78,6 +82,7 @@ export const rateItemProps = {
type: Number,
required: true,
},
+ color: String,
// events
onClick: {