2013-09-24 35 views
4

煎茶觸摸2.2.1
Cmd的3.1.342煎茶動態地添加到組分中生成不工作

我有用於顯示使用煎茶圖表和傳送帶數據的煎茶網絡應用程序。數據通過ajax獲得。組件根據從服務器接收的數據量創建。

一切工作正常發展。但是,當我創建生產版本時,組件會被創建,但不會與輪播和應用程序崩潰一起填充。看來,出現這種情況時,我嘗試使用轉盤添加轉盤到容器:Ext.getCmp(siteNamex+'Cont').add(thecarousel);

然後它死了,控制檯日誌說:

Uncaught TypeError: Cannot call method 'substring' of undefined Ext.ClassManager.parseNamespace
Ext.ClassManager.get
Ext.ClassManager.instantiate
Ext.ClassManager.instantiateByAlias
Ext.apply.factory
Ext.define.factoryItem
Ext.define.add Ext.Ajax.request.success
Ext.apply.callback
Ext.define.onComplete
Ext.define.onStateChange (anonymous function)

這裏是一個創建容器代碼:

newcontainer = Ext.Container({ 
     xtype : 'container', 
     flex: 1, 
     margin: '0', 
     id: siteNamex+'Cont', 
     itemId: siteNamex+'Cont', 
     height: '100%', 
     items: [], 
     cls:'siteContainer', 
     html: '<h2 class="siteName" style="'+snStyle+'">'+siteName+'</h2>' 
    }); 

此代碼似乎正在工作並根據需要創建容器。圖表填充數組。的大小取決於通過AJAX接收的數據:

var allcharts = new Array(); //initializing 

創建計圖表:

chartgx = Ext.chart.Chart({ 
     xtype: 'chart', 
     renderTo: Ext.getBody(), 
     cls: 'thegauge', 
     itemId: 'gauge'+tt2, 
     store: gaugeStore, 
     width : 'auto', 
     background: 'white', 
     animate: true, 
     insetPadding: 50, 
     axes: [{ 
       type: 'gauge', 
       position: 'gauge', 
       minimum: 0, 
       maximum: gaugemax, 
       steps: 10, 
      margin: 10 
      }], 
      series: [{ 
       type: 'gauge', 
       field: 'CurrentValue', 
       donut: 30, 
       colorSet: ['#f6821f;', '#e0e2e4'] 
      }] 
     }); 

然後我把這個計在一個容器中,並添加至數組:

chartgx2 = Ext.Container({ 
     xtype : 'container', 
     flex: 1, 
     layout: 'fit', 
     cls: 'gaugeContainer', 
     items: chartgx, 
     html: gaugeText 
      }) 
allcharts.push(chartgx2); 

轉盤然後創建使用:

thecarousel = Ext.Carousel({ 
         xtype: 'carousel', 
         width: '100%', 
         height: '100%', 
         itemId: 'thecarousel_'+siteName, 
         cls: 'chartscarousel', 
         id: siteNamex+'_carousel', 
         defaults: { 
          styleHtmlContent:true 
         }, 
         items: allcharts 
        }) 

,並被添加到容器使用Ext.getCmp(siteNamex+'Cont').add(thecarousel);

正如我前面所說,這一切都在開發中工作正常,但在生產構建它拋出了錯誤提到。

我app.js有以下幾點:

requires: [ 
     'Ext.field.Select', 
    'Ext.Ajax', 
    'Ext.Button', 
    'Ext.carousel.Indicator', 
    'Ext.carousel.Infinite', 
    'Ext.carousel.Item', 
    'Ext.carousel.Carousel', 
    'Ext.fx.easing.EaseOut', 
    'Ext.util.TranslatableGroup', 
    'Ext.chart.Chart', 
    'Ext.chart.axis.Gauge', 
    'Ext.chart.theme.*', 
    'Ext.util.Format', 
    'Ext.MessageBox', 
    'Ext.form.Panel', 
    'Ext.Panel', 
    'Ext.fx.Parser', 
    'Ext.Container', 
    'Ext.data.*', 
    'Ext.dataview.List', 
    'Ext.dataview.component.Container', 
    'Ext.chart.theme.Base', 
    'Ext.chart.theme.TitleStyle', 
    'Ext.chart.theme.GridStyle', 
    'Ext.chart.Toolbar', 
    'Ext.chart.legend.View', 
    'Ext.chart.Legend', 
    'Ext.chart.series.Bar', 
    'Ext.chart.series.Column', 
    'Ext.chart.series.Gauge', 
    'Ext.chart.series.Series', 
    'Ext.chart.axis.Numeric', 
    'Ext.chart.axis.Category', 
    'Ext.draw.Surface', 
    'Ext.draw.Draw', 
    'Ext.draw.Matrix', 
    'Ext.draw.engine.Canvas', 
    'Ext.draw.CompositeSprite', 
    'Ext.fx.Frame', 
    'Ext.draw.Sprite', 
    'Ext.fx.Sprite', 
    'Ext.Component', 
    'Ext.ComponentManager', 
    'Ext.ComponentQuery', 
    'Ext.TitleBar', 
    'Ext.draw.sprite.Sector', 
    'Ext.draw.sprite.Rect', 
    'Ext.chart.interactions.Abstract', 
    'Ext.chart.axis.Axis', 
    'Ext.util.SizeMonitor', 
    'Ext.chart.grid.HorizontalGrid', 
    'Ext.chart.grid.VerticalGrid' 
    ], 

當我運行生成命令沒有錯誤。 煎茶觸摸2.2.1
Cmd的3.1.342

更新: 我重建使用this code完全計,因爲它出現在頁面上。這並沒有解決問題

+0

看來,錯誤在於'allcharts'數組。我們可以看看嗎? – rixo

+0

@rixo:已添加代碼 –

+0

您可能錯過了一項要求,但我無法分辨哪個要求。 – rixo

回答

5

我會調試這樣的:

  1. 在Chrome中的「資源」選項卡
  2. 點擊兩次上打開您的應用程序
  3. 開放開發工具
  4. 圍棋暫停符號(「暫停未捕獲的異常」,圖像下方的左下箭頭)
  5. 做一件讓你的應用程序崩潰的事情,或者如果它在加載時崩潰就重新加載
  6. 調試器會踢只是扔你已經注意到
  7. 在調用堆棧異常之前,選擇行Ext.ClassManager.instantiateByAlias(第二個箭頭)
  8. 「範圍變量」標籤,你會看到的名稱罪魁禍首(圈起的波紋管)

由於縮小過程,變量名稱可能會有所不同,但您應該能夠輕鬆識別它。或者,您可以在文件.sencha/app/production.properties中禁用壓縮以查看真實代碼並使其更容易。

Chrome debugging

+0

謝謝你。錯誤似乎是:類型錯誤 參數:參數[2] 0:「axis.Gauge」,但我有'Ext.chart.axis.Gauge',在我的app.js需要 –

+0

您確定類' Ext.chart.axis.Gauge'存在嗎?它沒有在文檔中提到。只有一個量表系列。 – rixo

+0

這很有趣,因爲我肯定有它。這是觸摸/ src ....等 –