react-rating-system
v1.0.7
Published
A star rating component fully customizable made with React !
Downloads
11
Maintainers
Readme
react-rating-system
A star rating component fully customizable made with React !
#Demo
#Install
npm install react-rating-system
#Usage ###Example
import React from 'react'
import ReactDOM from 'react-dom';
import Rating from 'react-rating-system';
class YourClass extends React.Component {
render() {
return (
<Rating
image="../YOURPATH/imageName.png" bg="#333333" [...args]
/>
);
}
}
ReactDOM.render(
<YourClass />,
document.getElementById('app')
);
Check out more examples in the source code of the demo above
###Important
You will need to use an image with a solid background except for the zone you want to be "filled".
Take a look at the images in /dist
directory for a clearer understanding.
###Props
image: String
- (REQUIRED) path to the icon imagefillBG: String
- (REQUIRED) filling color in css format (name, hex or rgb)initialBG: String
- initial background color in css format (name, hex or rgb)initialValue: Number
- initial value of rating (i.e. AJAX received)editable: Bool
- whether users can vote or notcallback: Function
- callback function when a "star" is clicked, it will receive index (1 based) as arglockRating: Bool
- whether the user rating stay displayed or not after votingnumberStars: Number
- the number of "stars"containerStyle: Object
- style of the rating component container
MIT Licensed