NVD3 Tooltip Bug

Question

konnte ich die Frage lösen: Uncaught TypeError: Cannot read property 'showBarChart' of undefined in React

var that = this; 
chart.tooltip.contentGenerator(function (d) { 
     var html = "<div>"; 
     d.series.forEach(function(elem){ 
     Object.keys(data_obj).forEach(function(key_1) { 
      var outer_obj = data_obj[key_1]; 
      if (outer_obj["key"] === elem.key) { 
       that.showBarChart(elem.key); 
       var expr = outer_obj["values"][0]["expr"]; 
       html += "<p>" + elem.key + "</p>"; 
       html += "<p>x = " + d.value + ", y = " + elem.value + "</p>"; 
      } 
     }); 
     }) 
     html += "</div>"; 
     return html; 
    }); 

jedoch die Lösung auf eine sehr seltsame Fehler führte in nvd3scatterChart wenn die tooltip nicht weg auf mouse out geht und bleibt nur auf der Seite .

Wie kann ich das Problem beheben?

Answer 1

Das Problem war, dass ich in componentDidUpdate rief ich createScatterChart. Ich habe es auskommentiert und es hat gut funktioniert. Es geschah offenbar wegen React Workflow, dass ich in der Frage beschrieben werden gefunden: Trace why a React component is re-rendering

componentDidMount() { 
this.createScatterChart() 
} 

componentDidUpdate() { 
//this.createScatterChart() 
} 

Calling this.setState() within the component. This will trigger the following component lifecycle methods shouldComponentUpdate > componentWillUpdate > render > componentDidUpdate