React Star Ratings

[BlueChinchillaEatingDorito]

I'm implementing a pop up window on a webpage where a user can leave a review on a web app I'm working on using React. Right now, I have a Modal that opens and the user is presented with a Star Rating component they can select a rating for and a Comment box they can type comments in. The issue I have right now is that while it all renders fine, I can't seem to make the Star Ratings clickable. i.e. If the user clicks on a star, it doesn't actually change the default value of 0 stars. If the user hovers over the stars, they animate fine. But it just doesn't seem to be selectable. Any thoughts? 

 

Star Rating Code in the Modal within render()

<StarRating
	rating={this.state.rating}
	starRatedColor="red"
	changeRating={() => this.changeRating.bind(this)}
	numberOfStars={5}
	name='rating'
/>

Constructor for the page

constructor() {
	super()
	this.state = {
		show: false,
		rating: 0
	}
}

 

[elpiop]

I think you need to change the prop to: 

changeRating={this.changeRating.bind(this, event)}

 

or bind the function in your constructor,

this.changeRating = this.changeRating.bind(this)

 

and then change the prop to

changeRating={() => this.changeRating(event)}