mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
1.6 KiB
1.6 KiB
Rate
Install
import { Rate } from 'vant';
Vue.use(Rate);
Usage
Basic Usage
<van-rate v-model="value" />
export default {
data() {
return {
value: 3
};
}
}
Custom Icon
<van-rate
v-model="value"
icon="like"
void-icon="like-o"
/>
Custom Style
<van-rate
v-model="value"
:size="25"
color="#f44"
void-icon="star"
void-color="#eee"
/>
Half Star
<van-rate
v-model="value"
allow-half
void-icon="star"
void-color="#eee"
/>
export default {
data() {
return {
value: 2.5
};
}
}
Custom Count
<van-rate v-model="value" :count="6" />
Disabled
<van-rate v-model="value" disabled />
Readonly
<van-rate v-model="value" readonly />
API
Props
Attribute | Description | Type | Default |
---|---|---|---|
v-model | Current rate | Number |
- |
count | Count | Number |
5 |
size | Icon size (px) | Number |
20 |
color | Selected color | String |
#ffd21e |
void-color | Void color | String |
#c7c7c7 |
icon | Selected icon | String |
star |
void-icon | Void icon | String |
star-o |
allow-half | Whether to allow half star | Boolean |
false |
readonly | Whether to be readonly | Boolean |
false |
disabled | Whether to disable rate | Boolean |
false |
disabled-color | Disabled color | String |
#bdbdbd |
Events
Event | Description | Parameters |
---|---|---|
change | Triggered when rate changed | current rate |