Rate 评分 | Mind UI Vue

# Rate 评分

# 介绍

评分组件

# 引入

import { Rate } from 'mind-ui-vue';
Vue.use(Rate);

# 示例

# 基础用法

<m-rate v-model="value" @change="onChange" />

# 半选

<m-rate v-model="value" allow-half />

# 自定义数量

<m-rate v-model="3" :max="7" allow-half />

# 自定义步长 v1.0.4

<m-rate v-model="3" :max="10" :step="2" />

# 自定义图形

<m-rate v-model="4" icon="like-fill" color="#f00" void-icon="like-fill" />

# 只读

<m-rate v-model="4" readonly />

# 辅助文字

<m-rate 
  v-model="4" 
  show-text 
  :texts="['极差', '较差', '一般', '不错', '很棒']"
/>

# Api

# Props

参数	说明	类型	默认值
v-model	默认值	Number	—
step v1.0.4	步长	Number	`1`
max	图标数量	Number	`5`
size	图标大小，单位为 `px`	Number	`40`
icon	选中时的图标名称	String	`star`
color	选中图标颜色	String	`#ffd21e`
void-icon	未选中时的图标名称	String	`star-fill`
void-color	未选中图标颜色	String	`#c7c7c7`
allow-half	是否允许半选	Boolean	`false`
readonly	是否为只读状态	Boolean	`false`
show-score	是否显示当前分数	Boolean	`false`
show-text	是否显示辅助文字	Boolean	`false`
text-color	辅助文字颜色	String	`#ffd21e`
texts	辅助文字数组	Array	`['极差', '较差', '一般', '不错', '很棒']`

# Events

事件名称	说明	回调参数
change	分值改变时触发	`value`: 变更后的分值

← CheckBox 多选框