diff --git a/example/pages/rate/index.js b/example/pages/rate/index.js index ad5e96d6..6ccce815 100644 --- a/example/pages/rate/index.js +++ b/example/pages/rate/index.js @@ -3,8 +3,9 @@ import Page from '../../common/page'; Page({ data: { value1: 3, - value2: 4, - value3: 2 + value2: 3, + value3: 4, + value4: 2 }, onChange(event) { diff --git a/example/pages/rate/index.wxml b/example/pages/rate/index.wxml index 288cab07..d319fcde 100644 --- a/example/pages/rate/index.wxml +++ b/example/pages/rate/index.wxml @@ -6,11 +6,21 @@ /> - + + + + + diff --git a/packages/rate/README.md b/packages/rate/README.md index 4f65e941..df45acee 100644 --- a/packages/rate/README.md +++ b/packages/rate/README.md @@ -30,23 +30,38 @@ Page({ }); ``` -#### 自定义颜色 +#### 自定义图标 + + ```html + +``` + +#### 自定义样式 ```html ``` #### 禁用状态 ```html - + ``` ### API @@ -57,8 +72,10 @@ Page({ | value | 当前分值 | `Number` | - | | count | 图标总数 | `Number` | `5` | | size | 图标大小 (px) | `Number` | `20` | -| color | 选中时的颜色 | `String` | `#ffd21e` | +| color | 选中时的颜色 | `String` | `#ffd21e` | | void-color | 未选中时的颜色 | `String` | `#c7c7c7` | +| icon | 选中时的图标,可选值见 Icon 组件 | `String` | `star` | +| void-icon | 未选中时的图标,可选值见 Icon 组件 | `String` | `star-o` | | readonly | 是否为只读状态 | `Boolean` | `false` | | disabled | 是否禁用评分 | `Boolean` | `false` | | disabled-color | 禁用时的颜色 | `String` | `#bdbdbd` | diff --git a/packages/rate/index.ts b/packages/rate/index.ts index e56736ef..5c23d033 100644 --- a/packages/rate/index.ts +++ b/packages/rate/index.ts @@ -10,6 +10,14 @@ VantComponent({ type: Number, value: 20 }, + icon: { + type: String, + value: 'star' + }, + voidIcon: { + type: String, + value: 'star-o' + }, color: { type: String, value: '#ffd21e' diff --git a/packages/rate/index.wxml b/packages/rate/index.wxml index 8ac26e31..401075e7 100644 --- a/packages/rate/index.wxml +++ b/packages/rate/index.wxml @@ -8,7 +8,7 @@ class="van-rate__item" size="{{ size }}px" data-index="{{ index }}" - name="{{ item ? 'star' : 'star-o' }}" + name="{{ item ? icon : voidIcon }}" color="{{ disabled ? disabledColor : item ? color : voidColor }}" bind:click="onSelect" />