Таблица переключения и диаграммы ReactJs HighCharts не обновляются

Question

Я хочу отобразить таблицу и ее график с помощью переключателя.По умолчанию он должен отображать диаграмму, когда я нажимаю кнопку, он должен изменить вид таблицы.При первом щелчке это работает, но не работает со второго щелчка.

Я создал проект codesandbox. CodeSandbox

Какую ошибку я совершил в этом коде.

Answer 1

Динамическое изменение параметра showTable не меняет отображение таблицы. Вам нужно переключить видимость контейнеров:

Highcharts.Chart.prototype.viewData = function () {
  $(this.renderTo).toggle();
  if (!this.insertedTable) {
    var div = document.createElement('div');
    div.className = 'highcharts-data-table';
    // Insert after the chart container
    this.renderTo.parentNode.insertBefore(div, this.renderTo.nextSibling);
    div.innerHTML = this.getTable();
    this.insertedTable = true;
    div.id = this.container.id + '-data-table';
  } else {
    $('#' + this.container.id + '-data-table').toggle();
  }
};

Живая демоверсия: https://codesandbox.io/s/l4x11ykm67

Справочник по API: https://api.highcharts.com/highcharts/exporting.showTable