Ext tabpanel集成第三方charts(echarts、amcharts等)的问题(报getstyle为null的错误)

标签：

最近在做ext集成charts的功能，主要是使用tabpanel，将charts集成到tab中，随便切换tab选项就会报错崩溃。

之前演示的时候也发现了该问题，由于在tab项中有加载svg文件的操作，该svg文件是比较大的，开始是怀疑有可能是加载大文件时的问题，没有注意，但是后来将charts集成后该问题重复出现，必须解决。

这里自己给自己挖了一个大坑，出现问题时其实应该在有问题的代码处打上断点，看看相关的变量的值，当时就是没有，由于考虑是大文件的问题，随即换了另外的方式来加载svg文件，但是问题依旧。

后来发现如果不去加载charts则不会有问题，初步断定问题出现在加载charts的时候，随后换了几个其他的charts来测试，问题依旧。

所有的办法都试过了，再马上要确定是ext的bug时，在心里跳出了个念头，在错误的地方debug一下吧，随即打上了断点，运行调试，我去。。。错误的原因是tab来回切换时偶然的几率会导致getstyle未定义。

随即想到，tabpanel在生成div容器标签时会生成带有层级关系的dom，为何不将charts的container换成innerct试试呢？（tabpanel的tab向为div时，会生成有id-innerct之类的dom结构），将charts的container改成该id，错误解决，问题没有出现。

总结：ext在生成dom结构时，会生成多余的一些标签，而我们使用第三方库时，往往需要容器，比如我这里用的charts和一些其他的html5的库，而容器呢往往需要宽和高，暂时还不知道ext是如何渲染这个div的，这里记住一条，容器的Id最后使用最里层的带有innerct的div作为容器，如果需要宽和高的还需要计算下第一个tab的宽和高，OK。

Ext tabpanel集成第三方charts(echarts、amcharts等)的问题(报getstyle为null的错误)

标签：

原文地址：http://www.cnblogs.com/danyingjie/p/5063925.html