mirror of
https://github.com/youzan/vant.git
synced 2025-10-17 16:44:21 +00:00
docs(Rate): add more description (#8581)
This commit is contained in:
@@ -20,6 +20,8 @@ app.use(Rate);
|
||||
|
||||
### 基础用法
|
||||
|
||||
通过 `v-model` 来绑定当前评分值。
|
||||
|
||||
```html
|
||||
<van-rate v-model="value" />
|
||||
```
|
||||
@@ -37,12 +39,16 @@ export default {
|
||||
|
||||
### 自定义图标
|
||||
|
||||
通过 `icon` 属性设置选中时的图标,`void-icon` 属性设置未选中时的图标。
|
||||
|
||||
```html
|
||||
<van-rate v-model="value" icon="like" void-icon="like-o" />
|
||||
```
|
||||
|
||||
### 自定义样式
|
||||
|
||||
通过 `size` 属性设置图标大小,`color` 属性设置选中时的颜色,`void-color` 设置未选中时的颜色。
|
||||
|
||||
```html
|
||||
<van-rate
|
||||
v-model="value"
|
||||
@@ -55,6 +61,8 @@ export default {
|
||||
|
||||
### 半星
|
||||
|
||||
设置 `allow-half` 属性后可以选中半星。
|
||||
|
||||
```html
|
||||
<van-rate v-model="value" allow-half />
|
||||
```
|
||||
@@ -72,18 +80,24 @@ export default {
|
||||
|
||||
### 自定义数量
|
||||
|
||||
通过 `count` 属性设置评分总数。
|
||||
|
||||
```html
|
||||
<van-rate v-model="value" :count="6" />
|
||||
```
|
||||
|
||||
### 禁用状态
|
||||
|
||||
通过 `disabled` 属性来禁用评分。
|
||||
|
||||
```html
|
||||
<van-rate v-model="value" disabled />
|
||||
```
|
||||
|
||||
### 只读状态
|
||||
|
||||
通过 `readonly` 属性将评分设置为只读状态。
|
||||
|
||||
```html
|
||||
<van-rate v-model="value" readonly />
|
||||
```
|
||||
@@ -109,6 +123,8 @@ export default {
|
||||
|
||||
### 监听 change 事件
|
||||
|
||||
评分变化时,会触发 `change` 事件。
|
||||
|
||||
```html
|
||||
<van-rate v-model="value" @change="onChange" />
|
||||
```
|
||||
|
Reference in New Issue
Block a user