ui/vant
1
0
Fork 0
mirror of https://github.com/youzan/vant.git synced 2025-10-20 10:44:59 +00:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

[Improvement] Rate: rename component (#1002)

Browse Source
This commit is contained in:
neverland
2018-05-06 21:48:37 +08:00
committed by GitHub
parent a85747a248
commit 967c5339b8
13 changed files with 137 additions and 202 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/demos/index.js
View File

@@ -57,9 +57,9 @@ export default {
'progress': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/progress'), 'progress')), 'progress')),
'pull-refresh': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/pull-refresh'), 'pull-refresh')), 'pull-refresh')),
'radio': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/radio'), 'radio')), 'radio')),
'rate': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/rate'), 'rate')), 'rate')),
'search': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/search'), 'search')), 'search')),
'sku': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/sku'), 'sku')), 'sku')),
'star-rate': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/star-rate'), 'star-rate')), 'star-rate')),
'slider': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/slider'), 'slider')), 'slider')),
'stepper': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/stepper'), 'stepper')), 'stepper')),
'steps': asyncWrapper(r => require.ensure([], () => r(componentWrapper(require('./views/steps'), 'steps')), 'steps')),

52
docs/demos/views/rate.vue Normal file
View File

@@ -0,0 +1,52 @@
<template>
<demo-section>
<demo-block :title="$t('basicUsage')">
<van-rate v-model="valueA" />
</demo-block>
<demo-block :title="$t('customColor')">
<van-rate
v-model="valueB"
:size="25"
:todal="6"
:color="'#2ba'"
:default-color="'#ceefe8'"
/>
</demo-block>
<demo-block :title="$t('disabled')">
<van-rate disabled v-model="valueC" />
</demo-block>
</demo-section>
</template>
<script>
export default {
i18n: {
'zh-CN': {
disabled: '禁用状态',
customColor: '自定义颜色'
},
'en-US': {
disabled: 'Disabled',
customColor: 'Custom Color'
}
},
data() {
return {
valueA: 3,
valueB: 4,
valueC: 2
};
}
};
</script>
<style lang="postcss">
.demo-rate {
.van-rate {
margin-left: 15px;
}
}
</style>

83
docs/demos/views/star-rate.vue
View File

@@ -1,83 +0,0 @@
<template>
<demo-section>
<demo-block :title="$t('basicUsage')">
<div class="padding-15">
<van-star-rate
:total="totalA"
v-model="valueA"
:size="size"
/>
</div>
</demo-block>
<demo-block :title="$t('customColor')">
<div class="padding-15">
<van-star-rate
:total="totalB"
v-model="valueB"
:size="24"
:color="'#2ba'"
:default-color="'#ceefe8'"
/>
</div>
</demo-block>
<demo-block :title="$t('disabled')">
<div class="padding-15">
<van-star-rate
disabled
:total="totalC"
v-model="valueC"
/>
</div>
</demo-block>
</demo-section>
</template>
<script>
export default {
i18n: {
'zh-CN': {
disabled: '不可操作状态',
customColor: '自定义颜色'
},
'en-US': {
disabled: 'Disabled Component',
customColor: 'Custom Color'
}
},
data() {
return {
size: 30,
totalA: 7,
valueA: 5,
totalB: 6,
valueB: 4,
totalC: 8,
valueC: 2
};
},
methods: {
onSearch() {
Toast(this.value);
},
onCancel() {
Toast(this.$t('cancel'));
}
}
};
</script>
<style lang="postcss">
.demo-search {
.van-search__action div {
padding: 0 10px;
}
}
.padding-15 {
padding: 0 15px;
}
</style>

1
docs/markdown/index.js
View File

@@ -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')),

56
docs/markdown/zh-CN/rate.md Normal file
View File

@@ -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` |

92
docs/markdown/zh-CN/star-rate.md
View File

@@ -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 | - |

4
docs/src/doc.config.js
View File

@@ -137,8 +137,8 @@ module.exports = {
title: 'Progress - 进度条'
},
{
path: '/star-rate',
title: 'StarRate - 评分'
path: '/rate',
title: 'Rate - 评分'
},
{
path: '/slider',