将html文件导入到Sencha Touch 2中

我试图将外部html文件导入到Touch 2并遇到错误。我的看法代码如下：将html文件导入到Sencha Touch 2中

Ext.define("GS.view.Demo", { 
    extend: 'Ext.container.Container', 
    xtype: 'container', 

    requires: [ 
    'Ext.Component', 
    'Ext.ItemCollection', 
    'Ext.Mask', 
    'Ext.behavior.Scrollable', 
    'Ext.layout.Layout', 
    ], 

    config: { 
    title: 'Demo', 
    iconCls: 'star', 


    items: [{ 
       flex: 1, 
       margins: '0 2 0 0', 
       title: 'Load raw html', 
       styleHtmlContent: true, 
       bodyPadding: 5, 
       loader: { 
        autoLoad: true, 
        url: 'SHdemo.html' 
       } 
      }] 

     } 
    });

和apps.js：

//<debug> 
Ext.Loader.setPath({ 
'Ext': 'sdk/src' 
}); 
//</debug> 

Ext.application({ 
    controllers: ["Main"], 

name: 'GS', 

requires: [ 
    'Ext.MessageBox' 
], 

views: ['Main', 'Home', 'Contact', 'Blog', 'Demo'], 

icon: { 
    57: 'resources/icons/Icon.png', 
    72: 'resources/icons/Icon~ipad.png', 
    114: 'resources/icons/[email protected]', 
    144: 'resources/icons/[email protected]' 
}, 

phoneStartupScreen: 'resources/loading/Homescreen.jpg', 
tabletStartupScreen: 'resources/loading/Homescreen~ipad.jpg', 

launch: function() { 
    // Destroy the #appLoadingIndicator element 
    Ext.fly('appLoadingIndicator').destroy(); 

    // Initialize the main view 
    Ext.Viewport.add(Ext.create('GS.view.Main')); 
}, 

onUpdated: function() { 
    Ext.Msg.confirm(
     "Application Update", 
     "This application has just successfully been updated to the latest version.  Reload now?", 
     function() { 
      window.location.reload(); 
     } 
    ); 
    } 
});

这个代码抛出“如果他们的文件已加载以下类甚至没有宣称：“Ext.container.Container '“，如果我在我的视图中将'Ext.container.Container'替换为'Ext.Container'，我会得到”错误：[Ext.createByAlias]无法创建无法识别的别名的实例：widget.demo“。什么是导入外部html文件的正确过程？

来源

2012-03-25 kjarsenal

不需要xtype：'container'。您应该添加一个别名到您的集装箱像

extend: 'Ext.Container', 
alias:'widget.demo'

并将其添加到视域看起来是这样的

Ext.Viewport.add({xtype:'demo'});

来源

2012-03-26 17:12:33 fuzzyLikeSheep

感谢您的帮助，模糊。该别名否定了窗口小部件错误，但我不确定声明视口代码的位置，并因此无法加载外部文件。我的“演示”屏幕上刚刚有一个空容器。 – kjarsenal 2012-03-27 03:15:29

您可以将xtype：'Demo'添加到视口，然后使用exampleviewport.setActiveItem（）调用它。此外容器没有标题配置和边距应该是余量，bodyPadding应该只是填充。与加载器不同的是，您应该在侦听器中添加诸如初始化之类的内容。在你的Items配置文件的上面flex里添加xtype：'container'并将title改为html。 – fuzzyLikeSheep 2012-03-27 15:55:59

这里最大的问题是你有xtype：'container'。 xtype'container'已经被Ext.Container使用，所以你应该给你的类一个唯一的xtype。过去就像fuzzyLikeSheep提到的那样，在这种情况下你有很多配置是无效的配置。 ajax调用将帮助您而不是加载程序配置 – 2012-04-04 14:36:00

将html文件导入到Sencha Touch 2中

回答

相关问题