NVD3工具提示错误

Question

我能够解决以下问题： Uncaught TypeError：无法读取React中未定义的属性'showBarChart'

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;
    });

但是，当tooltip在mouse out scatterChart时不消失并且仅停留在页面上时，该解决方案导致nvd3 scatterChart出现一个非常奇怪的错误。

我该如何解决？

Answer 1

问题是在componentDidUpdate我正在调用createScatterChart 。 我将其注释掉，并且开始工作正常。 这显然是由于React工作流而发生的，我发现在以下问题中对此进行了描述： 跟踪为何重新渲染React组件

componentDidMount() {
 this.createScatterChart()
}

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

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