我试图学习ExtJS 4正在使用的新MVC体系结构,并遇到一些严重问题。下面是我得到的,当我加载页面(浏览器JS控制台):Ext.Load无法找到所需的文件
ext-all-debug.js:3713[Ext.Loader] Synchronously loading 'Exercise.controller.Users'; consider adding Ext.require('Exercise.controller.Users') above Ext.onReady
ext-all-debug.js:4757An uncaught error was raised with the following data:
ext-all-debug.js:4758
Object
ext-all-debug.js:4764Ext.Loader is not enabled, so dependencies cannot be resolved dynamically. Missing required class: Exercise.controller.Users
ext-all-debug.js:4771Uncaught Error
下面是我的代码崩溃:
的index.php
<html>
<head>
<title></title>
<style>
@import url('libraries/extjs/resources/css/ext-all.css');
</style>
<script src = "libraries/extjs/bootstrap.js"></script>
<!--
<script src = "public/app/controller/Users.js"></script>
-->
<script src = "public/app/app.js"></script>
<script>
</script>
</head>
<body>
</body>
</html>
现在,我知道包含的控制器脚本被注释掉。当我明确包含控制器时,此消息将消失。我问这个问题的原因是因为我认为Ext.loader应该负责为我加载所需的文件。
users控制器
Ext.define('Exercise.controller.Users', {
extend: 'Ext.app.Controller',
init: function() {
console.log('Initialized Users! This happens before the Application launch function is called');
}
});
的用户模型
Ext.define('Exercise.model.User', {
extend: 'Ext.data.Model',
fields: [{
name: 'id',
type: 'int'
}, {
name: 'created_at',
type: 'date',
dateFormat: 'Y-m-d H:i:s'
}, {
name: 'member_id',
type: 'int'
}, {
name: 'first_name',
type: 'string'
}, {
name: 'last_name',
type: 'string'
}, {
name: 'password',
type: 'string'
}, {
name: 'dob',
type: 'date',
dateFormat: 'Y-m-d'
}, {
name: 'email_address',
type: 'string'
}, {
name: 'is_active',
type: 'int'
}],
proxy: {
type: 'ajax',
format: 'json',
url: '../../_dev/json_fixtures/users.json',
reader: {
type: 'json',
root: 'users'
},
root: 'users'
}
});
用户视图
Exercise.views.user.list = Ext.extend(Ext.grid.Panel, {
store: Exercise.stores.users,
renderTo: Ext.getBody(),
columns:[{
header: 'Member ID',
dataIndex: 'member_id'
}, {
header: 'First Name',
dataIndex: 'first_name'
}, {
header: 'Last Name',
dataIndex: 'last_name'
}],
initComponent: function() {
Exercise.stores.users.load();
Exercise.views.UsersList.superclass.initComponent.apply(this, arguments);
}
});
的app.js文件
Ext.application({
name: 'Exercise',
autoCreateViewport: true,
appFolder: 'app',
controllers: [
'Users'
],
launch: function() {
Ext.create('Ext.container.Viewport', {
layout: 'fit',
items: [
{
xtype: 'panel',
title: 'Users',
html : 'List of users will go here'
}
]
});
}
});
附注:我已经尝试解决发现here无济于事,我已经试过appFolder
属性设置我的应用程序既../app
,只是app
。
感谢您的帮助。