Skip to content

Rate 评分 ​

评分组件。

基础用法 ​

默认不区分颜色。

辅助文字 ​

用辅助文字直接地表达对应分数。

文本图标 ​

支持使用文本作为图标。

半选 ​

属性 allow-half 允许半选。

只读 ​

只读的评分用来展示分数,支持半选。

允许清空 ​

设置 clearable 属性后,再次点击当前值可以清空(设为 0)。

Rate 属性 ​

属性名说明类型可选值默认值
model-value / v-model绑定值number—0
max最大分值number—5
disabled是否为只读boolean—false
allow-half是否允许半选boolean—false
icon图标组件 / 图标名称 / 文本string / Componentstar, heart, 文本star
void-icon未选中图标组件 / 图标名称string / Component—star
void-color未选中颜色string—#C6D1DE
disabled-void-color禁用状态下的未选中颜色string—#EFF2F7
colorsicon 的颜色array / object—['#F7BA2A', '#F7BA2A', '#F7BA2A']
show-text是否显示辅助文字boolean—false
show-score是否显示当前分数boolean—false
text-color辅助文字的颜色string——
texts辅助文字数组array—['极差', '失望', '一般', '满意', '惊喜']
score-template分数显示模板string—{value}
clearable是否允许再次点击后清除boolean—false
size图标尺寸string / number——

Rate 事件 ​

事件名说明回调参数
change分值改变时触发(value: number)