JS 控制台错误显示 Extjs 试图对 class 发出 GET 请求,就好像它是一个文件一样
JS console error shows Extjs trying to make a GET request for a class as if it was a file
抱歉,如果标题不是最好的。
我正在 Extjs 6 中完成一个测试项目。我有一个视图模型 class,它使用一个名为 customers
:
的商店
Ext.define('ChildSessionBinding.view.main.ChildSessionModel',{
extend: 'Ext.app.ViewModel',
alias: 'viewmodel.binding.childsession',
requires:[
'Ext.data.Store',
'ChildSessionBinding.model.Customer'
],
stores:{
customers:{
model: 'ChildSessionBinding.model.Customer',
autoLoad: true,
session: true
}
}
});
它需要的模型里面有硬编码的测试数据:
Ext.define('ChildSessionBinding.model.Customer', {
extend: 'Ext.data.Model',
fields: [
{ name: 'name', type: 'auto' },
{ name: 'phone', type: 'auto' }
],
data:[
{name: 'test', phone: '12345'}
]
});
使用 ViewModel 的视图只是一个显示简单网格的面板:
Ext.define('ChildSessionBinding.view.main.ChildSession', {
extend: 'Ext.panel.Panel',
xtype: 'binding-child-session',
title: 'Binding Child Session Demo',
layout: {
type: 'vbox',
align: 'stretch'
},
viewModel: {
type: 'binding.childsession'
},
controller: 'binding.childsession',
session: true,
items:[
{
flex: 1,
xtype: 'grid',
bind: '{customers}',
columns:[
{
dataIndex: 'name',
flex: 1,
text: 'Name'
},
{
dataIndex: 'phone',
flex: 1,
text: 'Phone'
},
{
xtype: 'widgetcolumn',
width: 90,
widget: {
xtype: 'button',
text: 'Edit',
handler: 'onEditCustomerClick'
}
}
]
}
]
});
当我在浏览器中加载它时,网格没有加载。我弹出 javascript 控制台,看到它正在尝试使用模型的完全限定名称向服务器发出获取请求:
我将它与 the kitchen sink example I'm trying to duplicate 以及我在其他项目中创建的其他视图模型商店进行了比较,但我没有发现任何会导致此问题的因素。
此外,为了排除任何项目文件结构问题,这里是 folder/file 结构:
编辑
这是来自 javascript 控制台的堆栈跟踪:
有人看到问题了吗?
我没有使用太多 Ext 5 或 6,但我想我在 Ext 4 上看到了这个错误。如果在 class 定义 Ext 期间未定义必需的 class将尝试在应用程序的根目录中加载具有该名称的文件。我认为 Ext 应该默认在这里抛出错误而不是尝试加载文件,因为我假设大多数应用程序都没有设置来处理这个问题。
修复方法是在加载 ChildSessionBinding.view.main.ChildSessionModel
之前定义并执行 ChildSessionBinding.model.Customer
,或者让您的应用程序能够加载 Ext 期望的文件。
将数据放在您的商店中,而不是您的模型中。模型没有 data property
.
抱歉,如果标题不是最好的。
我正在 Extjs 6 中完成一个测试项目。我有一个视图模型 class,它使用一个名为 customers
:
Ext.define('ChildSessionBinding.view.main.ChildSessionModel',{
extend: 'Ext.app.ViewModel',
alias: 'viewmodel.binding.childsession',
requires:[
'Ext.data.Store',
'ChildSessionBinding.model.Customer'
],
stores:{
customers:{
model: 'ChildSessionBinding.model.Customer',
autoLoad: true,
session: true
}
}
});
它需要的模型里面有硬编码的测试数据:
Ext.define('ChildSessionBinding.model.Customer', {
extend: 'Ext.data.Model',
fields: [
{ name: 'name', type: 'auto' },
{ name: 'phone', type: 'auto' }
],
data:[
{name: 'test', phone: '12345'}
]
});
使用 ViewModel 的视图只是一个显示简单网格的面板:
Ext.define('ChildSessionBinding.view.main.ChildSession', {
extend: 'Ext.panel.Panel',
xtype: 'binding-child-session',
title: 'Binding Child Session Demo',
layout: {
type: 'vbox',
align: 'stretch'
},
viewModel: {
type: 'binding.childsession'
},
controller: 'binding.childsession',
session: true,
items:[
{
flex: 1,
xtype: 'grid',
bind: '{customers}',
columns:[
{
dataIndex: 'name',
flex: 1,
text: 'Name'
},
{
dataIndex: 'phone',
flex: 1,
text: 'Phone'
},
{
xtype: 'widgetcolumn',
width: 90,
widget: {
xtype: 'button',
text: 'Edit',
handler: 'onEditCustomerClick'
}
}
]
}
]
});
当我在浏览器中加载它时,网格没有加载。我弹出 javascript 控制台,看到它正在尝试使用模型的完全限定名称向服务器发出获取请求:
我将它与 the kitchen sink example I'm trying to duplicate 以及我在其他项目中创建的其他视图模型商店进行了比较,但我没有发现任何会导致此问题的因素。
此外,为了排除任何项目文件结构问题,这里是 folder/file 结构:
编辑
这是来自 javascript 控制台的堆栈跟踪:
有人看到问题了吗?
我没有使用太多 Ext 5 或 6,但我想我在 Ext 4 上看到了这个错误。如果在 class 定义 Ext 期间未定义必需的 class将尝试在应用程序的根目录中加载具有该名称的文件。我认为 Ext 应该默认在这里抛出错误而不是尝试加载文件,因为我假设大多数应用程序都没有设置来处理这个问题。
修复方法是在加载 ChildSessionBinding.view.main.ChildSessionModel
之前定义并执行 ChildSessionBinding.model.Customer
,或者让您的应用程序能够加载 Ext 期望的文件。
将数据放在您的商店中,而不是您的模型中。模型没有 data property
.