我在控制台中遇到错误:Ext.application is not a function
。我的index.html
文件包含以下代码:
...
<link rel="stylesheet" type="text/css" href="/ext-5.0.1/packages/ext-theme-neptune/build/resources/ext-theme-neptune-all.css" />
<script src="/ext-5.0.1/ext-all-debug.js"></script>
<script type="text/javascript" src="app.js"></script>
...
虽然app.js
只有这个代码,但是从一个演示中获取:
Ext.application({
name: 'AM',
appFolder: 'app',
launch: function() {
Ext.create('Ext.container.Viewport', {
layout: 'fit',
items: [{
xtype: 'panel',
title: 'Users',
html : 'List of users will go here'
}]
});
}
});
修改
顺便说一下,即使运行“官方”/ext-5.0.1/examples/app/simple/simple.html
我也会遇到同样的错误。那是为什么?
答案 0 :(得分:3)
而不是
<script src="/ext-5.0.1/ext-all-debug.js"></script>
你应该使用
<script src="/ext-5.0.1/build/ext-all-debug.js"></script>
第二个按预期包含所有组件和类。
答案 1 :(得分:2)
将来自Ext.application
阻止内的Ext.onReady
的呼叫包裹起来。
// app.js
Ext.onReady(function() {
Ext.application({
name: 'AM',
appFolder: 'app',
launch: function() {
Ext.create('Ext.container.Viewport', {
layout: 'fit',
items: [{
xtype: 'panel',
title: 'Users',
html : 'List of users will go here'
}]
});
}
});
})
这是必要的,BTW,是ext-all-debug.js文件并不包含所有ExtJS。它包含引导代码 - 知道如何获取其他所有内容的代码。其中的一部分&#34;其他一切&#34;是应用程序代码。因此,在有机会运行之前,Ext.application不存在。
您提到的门户网站示例之所以有效,是因为它使用了sencha app build
- microloader.js
的结果。这会加载ExtJS的完整版本(或者更确切地说,应用程序中使用的部分),因此Ext.application已经在它使用的时间定义。 (与Sencha Fiddle一样 - 你也不需要Ext.onReady)