sencha-touch - 如何使 XTemplate 与 Sencha Touch 中的 TabPanel 一起工作

Question

我的 TabPanels 按预期生成，但是，如果我尝试将一个XTemplate注入其中一个面板，然后调用content.update(myArray);，结果是面板不移动，按钮不工作，模板不'不渲染。

谁能告诉我我做错了什么？

<script type="text/javascript">
    Ext.setup({
        onReady: function () {
            var rootPanel,
                videoPanel,
                aboutPanel,
                videoTpl,
                bergman,
                gray,
                videosToShow

            bergman = { id: "23657322" };
            gray = { id: "23694183" };
            videosToShow = [bergman, gray];

            videoTpl = new Ext.XTemplate(
                '<tpl for=".">',
                '<iframe src="http://player.vimeo.com/video/{id}?title=0&amp;byline=0&amp;portrait=0&amp;color=80ceff" ',
                'width="400" ',
                'height="225" ',
                'frameborder="0">',
                '</iframe>',
                '</tpl>'
            );

            videoPanel = {
                title: "Videos",
                tpl: videoTpl,
                iconCls: "tv",
                badgeText: "1",
                dockedItems: [{ xtype: "toolbar", title: "Videos"}],
                scroll: "vertical"
            };

            aboutPanel = {
                title: "About",
                html: "About RockPointe Church.",
                iconCls: "more",
                dockedItems: [{ xtype: "toolbar", title: "About"}],
                scroll: "vertical"
            };

            rootPanel = new Ext.TabPanel({
                fullscreen: true,
                layout: 'card',
                items: [videoPanel, aboutPanel],
                tabBar: { dock: 'bottom' }
            });

            content.update(videosToShow);
        }
    });
</script>

Answer 1

我想到了

我需要videoPanel.update(videosToShow);

我也不得不
videoPanel = {
改变
videoPanel = new Panel({