[Improvement] Rate: rename component (#1002)
This commit is contained in:
@@ -54,6 +54,7 @@ export default {
|
||||
'zh-CN/pull-refresh': wrapper(r => require.ensure([], () => r(require('./zh-CN/pull-refresh.md')), 'zh-CN/pull-refresh')),
|
||||
'zh-CN/quickstart': wrapper(r => require.ensure([], () => r(require('./zh-CN/quickstart.md')), 'zh-CN/quickstart')),
|
||||
'zh-CN/radio': wrapper(r => require.ensure([], () => r(require('./zh-CN/radio.md')), 'zh-CN/radio')),
|
||||
'zh-CN/rate': wrapper(r => require.ensure([], () => r(require('./zh-CN/rate.md')), 'zh-CN/rate')),
|
||||
'zh-CN/search': wrapper(r => require.ensure([], () => r(require('./zh-CN/search.md')), 'zh-CN/search')),
|
||||
'zh-CN/sku': wrapper(r => require.ensure([], () => r(require('./zh-CN/sku.md')), 'zh-CN/sku')),
|
||||
'zh-CN/slider': wrapper(r => require.ensure([], () => r(require('./zh-CN/slider.md')), 'zh-CN/slider')),
|
||||
|
||||
@@ -0,0 +1,56 @@
|
||||
## Rate 评分
|
||||
|
||||
### 使用指南
|
||||
``` javascript
|
||||
import { Rate } from 'vant';
|
||||
|
||||
Vue.use(Rate);
|
||||
```
|
||||
|
||||
### 代码演示
|
||||
|
||||
#### 基础用法
|
||||
|
||||
```html
|
||||
<van-rate v-model="value" />
|
||||
```
|
||||
|
||||
```javascript
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
value: 3
|
||||
};
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 自定义颜色
|
||||
|
||||
```html
|
||||
<van-rate
|
||||
v-model="value"
|
||||
:size="25"
|
||||
:todal="6"
|
||||
:color="color",
|
||||
:defaultColor="defaultColor"
|
||||
/>
|
||||
```
|
||||
|
||||
#### 禁用状态
|
||||
|
||||
```html
|
||||
<van-rate v-model="value" disabled />
|
||||
```
|
||||
|
||||
### Rate API
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
|-----------|-----------|-----------|-------------|
|
||||
| v-model | 当前分数 | `Number` | - |
|
||||
| size | 星标大小,单位为`px` | `Number` | `20` |
|
||||
| total | 总分 | `Number` | `5` |
|
||||
| color | 选中时的星标颜色 | `String` | `#ffd21e` |
|
||||
| default-color | 未选中时的星标颜色 | `String` | `#c7c7c7` |
|
||||
| disabled-color | 不可选时的星标颜色 | `String` | `#bdbdbd` |
|
||||
| disabled | 是否禁用评分 | `Boolean` | `false` |
|
||||
@@ -1,92 +0,0 @@
|
||||
## StarRate 评分
|
||||
|
||||
### 使用指南
|
||||
``` javascript
|
||||
import { StarRate } from 'vant';
|
||||
|
||||
Vue.use(StarRate);
|
||||
```
|
||||
|
||||
### 代码演示
|
||||
|
||||
#### 基础用法
|
||||
|
||||
```html
|
||||
<van-star-rate
|
||||
:total="total"
|
||||
v-model="value"
|
||||
:size="30"
|
||||
/>
|
||||
```
|
||||
|
||||
```javascript
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
size: 30,
|
||||
value: 3,
|
||||
total: 6
|
||||
};
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 自定义颜色
|
||||
|
||||
```html
|
||||
<van-star-rate
|
||||
:total="total"
|
||||
v-model="value"
|
||||
:size="size",
|
||||
:color="color",
|
||||
:defaultColor="defaultColor"
|
||||
/>
|
||||
```
|
||||
|
||||
```javascript
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
size: 24,
|
||||
value: 5,
|
||||
total: 7,
|
||||
color: '#2ba',
|
||||
defaultColor: '#ceefe8'
|
||||
};
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
#### 竖向步骤条
|
||||
```html
|
||||
<van-star-rate
|
||||
disabled
|
||||
:total="total"
|
||||
v-model="value"
|
||||
/>
|
||||
```
|
||||
|
||||
```javascript
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
value: 2,
|
||||
total: 6
|
||||
};
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### StarRate API
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|
||||
|-----------|-----------|-----------|-------------|-------------|
|
||||
| size | 星标大小,单位为`px` | `Number` | 20 | - |
|
||||
| total | 总分,默认为5 | `Number` | 5 | - |
|
||||
| value | 分数 | `Number` | 0 | - |
|
||||
| color | 选中时的星标颜色 | `String` | `#ffd21e` | - |
|
||||
| default-color | 未选中时的星标颜色 | `String` | `#c7c7c7` | - |
|
||||
| disabled-color | 不可选时的星标颜色 | `String` | `bdbdbd` | - |
|
||||
| disabled | 是否可修改 | `Boolean` | false | - |
|
||||
|
||||
Reference in New Issue
Block a user