2013-09-24 31 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 ....等 –