This question has already been answered:

I want to create an event handler for the Chart component of react-google-charts

The documentation is an example:

<Chart chartType="ScatterChart" rows={this.state.rows} columns={this.state.columns} options={this.state.options} graph_id="ScatterChart" width="100%" height="400px" chartEvents={this.chartEvents} // <- Это обработчик события />

The chartEvents itself looks like this:

 this.chartEvents=[ { eventName : 'select', callback : function(Chart) { console.log("Selected ",Chart.chart.getSelection()); } }];

I want inside the handler to call the local state change function this.setState. But inside the callback function, the context refers to the object that calls it. How to be in this situation?

 this.chartEvents=[ { eventName : 'select', callback : function(Chart) { //тут хочу обратиться к this.setState() } }];

Reported as a duplicate at Grundy. javascript Nov 10 '16 at 6:31 .

A similar question was asked earlier and an answer has already been received. If the answers provided are not exhaustive, please ask a new question .

    1 answer 1

    Use the arrow arrow function to save context.

     this.chartEvents=[ { eventName : 'select', callback : Chart => { console.log(this.setState); } }];