Rate

何时使用 {#when-to-use}

• 对评价进行展示。
• 对事物进行快速的评级操作。

代码演示 {#examples}

<!-- prettier-ignore -->

<code src="./demo/basic.tsx">基本</code> <code src="./demo/size.tsx" version="6.0.0">尺寸</code> <code src="./demo/half.tsx">半星</code> <code src="./demo/text.tsx">文案展现</code> <code src="./demo/disabled.tsx">只读</code> <code src="./demo/clear.tsx">清除</code> <code src="./demo/character.tsx">其他字符</code> <code src="./demo/character-function.tsx">自定义字符</code> <code src="./demo/component-token.tsx" debug>组件 Token</code>

API

通用属性参考：通用属性

属性	说明	类型	默认值	版本	全局配置
allowClear	是否允许再次点击后清除	boolean	true		×
allowHalf	是否允许半选	boolean	false		×
character	自定义字符	ReactNode | (RateProps) => ReactNode	<StarFilled />	function(): 4.4.0	×
count	star 总数	number	5		×
defaultValue	默认值	number	0		×
disabled	只读，无法进行交互	boolean	false		×
keyboard	支持使用键盘操作	boolean	true	5.18.0	×
size	星星尺寸	'small' | 'medium' | 'large'	'medium'		×
tooltips	自定义每项的提示信息	TooltipProps[] | string[]	-		×
value	当前数，受控值	number	-		×
onBlur	失去焦点时的回调	function()	-		×
onChange	选择时的回调	function(value: number)	-		×
onFocus	获取焦点时的回调	function()	-		×
onHoverChange	鼠标经过时数值变化的回调	function(value: number)	-		×
onKeyDown	按键回调	function(event)	-		×

方法

名称	描述
blur()	移除焦点
focus()	获取焦点

主题变量（Design Token）{#design-token}

<ComponentTokenTable component="Rate"></ComponentTokenTable>