Question

我是ext js的新手，客户希望我在某些网站上使用它，所以，我正在用它砸我的头，我正在使用ext js 4.0.7和他们称之为MVC。我来啦。

我正在创建一个带有“卡片布局”的“面板”，我想要动态加载项目，所以我使用的是“加载器”。这是我正在做的一个例子

//the panel
{
  xtype:'panel',
  id: 'options-panel',
  title: 'Options',
  region:'north',
  layout:"card",
  activeItem:0,
  height: 200,
  autoScroll: true,
  items:{
    loader:{
      autoLoad : true,
      url: '/staticdata/menu-toolbar-data.json',
      renderer: "component"
    } 
  }
}

//example data file menu-toolbar-data.json
[
  {
    xtype:'toolbar',
    vertical: true,
    height: 173,
    id:"button1-toolbar",
    layout: {
      type: 'vbox',
      align : 'stretch',
      pack  : 'start'
    },
    items: [
      {
        text: 'Gestion Button1',
        enableToggle: true
      },'-',
      {
        text: 'Selection Button1',
        enableToggle: true
      }
    ]
  },
  {
    xtype:'toolbar',
    vertical: true,
    height: 173,
    id:"button2-toolbar",
    layout: {
      type: 'vbox',
      align : 'stretch',
      pack  : 'start'
    },
    items: [
      {
        text: 'G Button2',
        enableToggle: true
      },'-',{
        text: 'S Button2',
        enableToggle: true
      }
    ]
  } 
]

到目前为止，我可以看到带有按钮的第一个工具栏。这没关系，但是当我尝试激活第二个工具栏时，出现错误。我正在使用这个：

Ext.getCmp('options-panel').layout.setActiveItem(1);

使用firebug，我可以在控制台中看到这个：

TypeError: component is undefined
http://www.learningext.com.localhost/extjs/src/ComponentManager.js?_dc=1330059491008
Line 55

这里有趣的是，如果我从.json文件中复制代码并将其粘贴到“面板”的“项目”中，我就停止了，这意味着不使用“加载器”，一切正常！如果我保留“加载器”但更改面板的布局，我可以看到2个工具栏，所以我在这里缺少什么？装载机是不是应该工作，还是我做错了什么？希望你能帮助我。

由于

Answer 1

Ext.Loader仅用于加载完整的类。如果您只是加载JSON块作为容器的子项加载，则可以使用ComponentLoader类。

这里有几个例子：http://dev.sencha.com/deploy/ext-4.0.0/examples/component-loader/component-loader.html

最后一个可能就是你想要实现的目标。

使用Ext js“loader”动态加载项目

1 个答案: