Question

我正在反应中设置一个HightCharts，并想使用功能（图表）。

我想在反应中使用它。

function (chart){
chart.renderer.label().css().attr().add()
}

在简单的js中，它易于使用，如下所示

$('#container').highcharts({},function (chart){
chart.renderer.label().css().attr().add()
};

如何解决此问题？

Answer 1

最简单的方法是使用Highcharts React之类的库，它是React的Highcharts包装器。在您的课程中，实现会像这样：

componentDidMount() {
  this.chartRef = React.createRef();

  // Reference could could then be called somewhere else
  this.chartRef.renderer.label().css().attr().add();
}

render() {
  return (
    <HighchartsReact
      highcharts={ Highcharts }
      options={ options }
      ref={ this.chartRef }
    />
  );
}

Answer 2

通过使用declare module 'react' { interface HTMLAttributes<T> extends AriaAttributes, DOMAttributes<T> { // extends React's HTMLAttributes custom?: string; } }包装器，您可以利用highcharts-react-official选项来调用函数：

callback

实时演示： https://codesandbox.io/s/wolq576wo5

文档： https://github.com/highcharts/highcharts-react#callback

如何在反应中使用功能（图表）？

2 个答案: