как использовать функцию (график) в реакции?

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-official, вы можете воспользоваться опцией callback для вызова функции:

render() {
  return (
    <div>
      <HighchartsReact
        ...
        callback={function(chart) {
          chart.renderer.label().css().attr().add()
        }}
      />
    </div>
  );
}

Демонстрационная версия: https://codesandbox.io/s/wolq576wo5

Документы: https://github.com/highcharts/highcharts-react#callback

Answer 2

Самый простой способ - использовать такую ​​библиотеку, как Highcharts React , которая является оболочкой Highcharts для React. Реализация будет примерно такой в ​​вашем классе:

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