javascript - Access props and state of current component in React JS within an event handler -

i using highcharts.js in conjunction react.js. want re-render view when user clicks point in highcharts. this, need access props variable in click handler. normally, use this.props update props, won't work in event handler. therefore, how access current component variable in event handler can access props? there better way of doing trying do?

my config variable highcharts looks this. clarify, code coming render function of same component.

var config = {       ...       plotoptions: {           series: {               cursor: 'pointer',               point: {                   events: {                       click: function (event) {                         //the `this` variable not have props or state here                         //`this` refers point object on graph here                       }                   }               }           }       },     }; 

thanks help.

you define click handler function somewhere outside config variable, , should have access outside scope of event.

myrerenderfunction(e) { /* */ } // define function here...  var config = {       ...           events: {               click: myrerenderfunction // ...and it's accessible since they're defined in same scope           }     }; 

or put rerendering outside click handler.

myrerenderfunction(e) { /* */ } // closure...  var config = {       ...           events: {               click: function(e) {                   /* event */                   myrerenderfunction(e); // ...which means can access inside click handler function               }           }     }; 

or store current this closure.

var whateverscopethisis = this;  var config = {       ...           events: {               click: function(e) {                   /* event */                   whateverscopethisis.dosomething(e);               }           }     }; 

you've got plenty of options, along lines should work.