Rating 评分

Guide

评分组件通常用于用户反馈场景。

基本

最简单的用法。





尺寸

通过 size 属性可以控制评分组件的大小,支持三种尺寸 small, medium, large。 默认尺寸为 medium

半星评分

默认情况下评分组件只支持整数评分,通过开启 allowHalf 属性可以支持半星评分。

只读模式

设置 disabled 属性后,评分组件仅展示模式,不可选择。

无障碍

组件内置了部分支持无障碍, 但是额外需要开发者手动事情才能完整支持无障碍:给 Rating 传入一个 id,就可以支持语音提示当前选择的评分。注意:如果一个页面上有多个 Rating,id 属性一定不能相同。

等级提示

添加 showGrade 属性,使评分组件具有等级提示信息。

API

Rating

参数说明类型默认值
defaultValue默认值Number0
size尺寸

可选值:
'small', 'medium', 'large'
Enum'medium'
valueNumber-
count评分的总数Number5
showGrade是否显示 gradeBooleanfalse
allowHalf是否允许半星评分Booleanfalse
onChange用户点击评分时触发的回调

签名:
Function(value: String) => void
参数:
value: {String} 评分值
Functionfunc.noop
onHoverChange用户hover评分时触发的回调

签名:
Function(value: String) => void
参数:
value: {String} 评分值
Functionfunc.noop
disabled是否禁用Booleanfalse
readAs评分文案生成方法,传入id支持无障碍时,读屏软件可读

签名:
Function() => void
Functionval => val

ARIA and KeyBoard

按键说明
Up Arrow增加星级评分
Down Arrow减少星级评分
Right Arrow增加星级评分
Left Arrow减少星级评分