Ошибка "Панель инструментов, а не конструктор" в Google Charts - PullRequest
Новая
       8

Ошибка "Панель инструментов, а не конструктор" в Google Charts

0 голосов
/ 15 ноября 2018

Я наивный разработчик React и столкнулся с некоторыми трудностями при работе с Google. Я использую Google Charts в компоненте ReactJs с ControlWrapper, как показано ниже. 

componentDidMount: function(){
google.charts.load('current', {'packages':['corechart', 'controls']});
this.drawCharts();
},
componentDidUpdate: function(){
 google.charts.load('current', {'packages':['corechart', 'controls']});
this.drawCharts();
},
drawCharts: function(){
var cmpt = this;
//Removed detailed code from here due to copyright issues

//adding controls----------------

  let dashboard = new google.visualization.Dashboard( document.getElementById(cmpt.props.widgetId) );
  let controlId = '${this.props.widgetId}_control';
  var controlWrapper = new google.visualization.ControlWrapper({
    'controlType' : 'NumberRangeFilter',
    'containerId' : controlId,
    'options' : {
      'filterColumnLabel' : xDataSysName
    }
  });
  var barChart = new google.visualization.ChartWrapper({
    'chartType': 'BarChart',
    'containerId': this.props.widgetId,
    'options': options
  });

  dashboard.bind(controlWrapper, barChart);
  dashboard.draw(data);

  if(linkColumn){
    let selectionEventHandler = function() {
      window.location = data.getValue(barChart.getSelection()[0]['row'], 1 );
    };
      google.visualization.events.addListener(barChart, 'select', selectionEventHandler);
   }
  }
},

Это не весь кусок кода, но должно быть достаточно для проблемы, с которой я сталкиваюсь.

При первой загрузке страницы в консоли появляется сообщение об ошибке

google.visualization.Dashboard is not a constructor

Я перезагружаю страницу, нажимая SHIFT + F5, ошибка исчезает и компоненты загружаются нормально, кроме тех, которые зависят от controlWrapper, выдавшего ошибку следующим образом

google.visualization.controlWrapper is not a constructor

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

1 Ответ

0 голосов
/ 15 ноября 2018

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

попробуйте изменить оператор загрузки следующим образом ... 

componentDidMount: function(){
  google.charts.load('current', {packages:['corechart', 'controls'], callback: this.drawCharts});
},
componentDidUpdate: function(){
  google.charts.load('current', {packages:['corechart', 'controls'], callback: this.drawCharts});
},
...