2016-07-21 10:10:04 +08:00
|
|
|
---
|
|
|
|
category: Components
|
2016-11-09 14:43:32 +08:00
|
|
|
type: Data Entry
|
2016-07-21 10:10:04 +08:00
|
|
|
title: Rate
|
2020-06-05 13:50:09 +08:00
|
|
|
cover: https://gw.alipayobjects.com/zos/alicdn/R5uiIWmxe/Rate.svg
|
2016-07-21 10:10:04 +08:00
|
|
|
---
|
|
|
|
|
|
|
|
Rate component.
|
|
|
|
|
2016-09-10 13:43:30 +08:00
|
|
|
## When To Use
|
2016-07-21 10:10:04 +08:00
|
|
|
|
2016-11-16 21:33:37 +08:00
|
|
|
- Show evaluation.
|
2016-07-21 10:10:04 +08:00
|
|
|
- A quick rating operation on something.
|
|
|
|
|
|
|
|
## API
|
|
|
|
|
2020-06-11 14:11:21 +08:00
|
|
|
| Property | Description | type | Default | Version |
|
|
|
|
| --- | --- | --- | --- | --- |
|
|
|
|
| allowClear | whether to allow clear when click again | boolean | true | |
|
|
|
|
| allowHalf | whether to allow semi selection | boolean | false | |
|
|
|
|
| autoFocus | get focus when component mounted | boolean | false | |
|
|
|
|
| character | custom character of rate | ReactNode \| ({ index }) => ReactNode | [`<StarFilled />`](/components/icon/) | Function(): 4.4.0 |
|
|
|
|
| className | custom class name of rate | string | | |
|
|
|
|
| count | star count | number | 5 | |
|
|
|
|
| defaultValue | default value | number | 0 | |
|
|
|
|
| disabled | read only, unable to interact | boolean | false | |
|
|
|
|
| style | custom style object of rate | CSSProperties | | |
|
|
|
|
| tooltips | Customize tooltip by each character | string\[] | | |
|
|
|
|
| value | current value | number | | |
|
|
|
|
| onBlur | callback when component lose focus | Function() | | |
|
|
|
|
| onChange | callback when select value | Function(value: number) | | |
|
|
|
|
| onFocus | callback when component get focus | Function() | | |
|
|
|
|
| onHoverChange | callback when hover item | Function(value: number) | | |
|
|
|
|
| onKeyDown | callback when keydown on component | Function(event) | | |
|
2017-12-01 19:28:41 +08:00
|
|
|
|
|
|
|
## Methods
|
|
|
|
|
2019-11-22 14:37:39 +08:00
|
|
|
| Name | Description |
|
|
|
|
| ------- | ------------ |
|
|
|
|
| blur() | remove focus |
|
|
|
|
| focus() | get focus |
|