i getting following error:
bundle.js:74359 uncaught typeerror: cannot read property 'setstate' of undefined.
i have sent onchange method bind , arrow rocket no success.
import reactstars 'react-stars' import react, {component} 'react'; import { field, reduxform, initialize, change} 'redux-form'; import { connect } 'react-redux'; class ratingsnew extends component{ constructor(props) { super(props); this.state = { overall_review : 1 }; } renderfield(field){ const {meta:{touched, error}} = field; if (field.type =="text"){ return( <div classname = "form-group"> <label>{field.label}</label> <input classname = "form-control" {...field.input} /> <div classname = "text-help"> {touched ? error : "" } </div> </div> ); } else{ return( <div classname = "form-group"> <label>{field.label}</label> <reactstars count = {5} size = {20} onchange={(value)=>{ onchange(field.input.name, value) }} /> <div classname = "text-help"> {touched ? error : "" } </div> </div> ); } } onsubmit(values){ console.log(values) } render(){ const {handlesubmit} = this.props return( <form onsubmit= {handlesubmit(this.onsubmit.bind(this))}> <div classname= "row"> <div classname= "col-md-4"> <field label = "student name" name = "student_name" type = "text" component = {this.renderfield} /> </div> <div classname= "col-md-4"> <field label = "email" name = "student_email" type = "text" component = {this.renderfield} /> </div> <div classname= "col-md-4"> <field label = "anonymous" name = "anonymous" type = "text" component = {this.renderfield} /> </div> </div> <field label = "title" name = "title" type = "text" component = {this.renderfield} /> <field label = "description" name = "description" type = "text" component = {this.renderfield} /> <div classname = "row"> <div classname = "col-sm-3"> <field label = "overall" name = "overall_review" type = "hidden" component = {this.renderfield} /> </div> <div classname = "col-sm-3"> <field label = "curriculum" name = "curriculum_review" type = "hidden" component = {this.renderfield} /> </div> <div classname = "col-sm-3"> <field label = "instructor" name = "instructor_review" type = "hidden" component = {this.renderfield} /> </div> <div classname = "col-sm-3"> <field label = "job assistance" name = "job_assistance_review" type = "hidden" component = {this.renderfield} /> </div> </div> <button type = "submit" classname = "btn btn-primary">submit</button> </form> ); }; } function validate(values){ const errors = {} if(!values.student_name){ errors.student_name = "enter name" } if(!values.student_email){ errors.student_email = "enter email" } if(!values.title){ errors.title = "enter title" } if(!values.description){ errors.description = "enter description" } if(!values.overall_review){ errors.overall_review = "share overall review" } if(!values.curriculum_review){ errors.curriculum_review = "share curriculum review" } if(!values.curriculum_review){ errors.instructor_review = "share instructor review" } if(!values.job_assistance_review){ errors.job_assistance_review = "share job assistance review" } return errors } function onchange(name, value){ console.log(value); console.log(name); this.setstate("rating": value); } export default reduxform({ validate, form: 'ratingform' })( connect(null,{change})(ratingsnew) ); what need fix error?
your onchange function should part of component can use this :
class ratingsnew extends component { // .. other code .. onchangerating = (name, value) => { console.log(value); console.log(name); this.setstate({ rating: value }); } // bind `renderfield`: renderfield = (field) => { // ... } } <reactstars count={5} size={20} onchange={(value) => { this.onchangerating(field.input.name, value); }} /> 
Comments
Post a Comment