Reagieren google-Charts Rückruf

Question

Ich möchte von react-google-charts

Off ein Ereignishandler für Chart-Komponente erstellen. Dokumentation hat ein Beispiel.

<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} // <- this is event handler 
    /> 

chartEvents sieht aus wie

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

Wie kann ich auf Klassenkontext von der Callback-Funktion beziehen? Ich möchte meinen lokalen Staat ändern.

this.chartEvents=[ 
    { 
    eventName : 'select', 
    callback : function(Chart) { 
     // here I want to refer to this.setState 
     console.log("Selected ",Chart.chart.getSelection()); 
    } 
    } 
]; 

Answer 1

Ich hatte das gleiche Bedürfnis wie Sie und konnte es tun. Sie können eine Variable (superClass im folgenden Beispiel) erstellen und ihr den Wert der Klasse (this) zuweisen. Auf diese Weise können Sie im Rahmen des Callbacks noch darauf zugreifen.

const superClass = this; 
this.chartEvents = [ 
    { 
    eventName: 'select', 
    callback(Chart) { 
     // here you can refer to superClass.setState 
     console.log("Selected ",Chart.chart.getSelection()); 
    }, 
    }, 
];