React Hooks Rate Component
React Rate Component - Demo
npm install react-rate-component --save
import ReactRateComponent 'react-rate-component'
class Foo extends Component {
changeRating(newRating) {
setRate(newRating)
}
render() {
return (
<ReactRateComponent
defaultValue={3}
showCount={true}
onChange={this.changeRating}
/>
);
}
}
class Bar extends Component {
render() {
return (
<ReactRateComponent />
);
}
}
Property | Description | Default value | Type |
---|---|---|---|
count |
Total symbol count | 5 | number |
edit |
You can make disable your rate symbols | true |
boolean |
showCount |
Set rating value | false |
boolean |
defaultValue |
Set rating default value | 0 | number |
symbol |
Which character you want to use | ★ | string |
size |
Size of symbol (px) | 25px |
string |
activeColor |
Color of selected or active symbols | #ffd700 |
string |
inactiveColor |
Color of inactive symbols | #949494 |
string |
Callback | Description | Type |
---|---|---|
onChange(new_rating) |
Will be invoked any time the rating is changed | function (value) {} |
- Write tests
License MIT