ExtJS — 如何在 ajax 调用后手动加载存储数据?
ExtJS — How to load store data manually after ajax call?
我将我的工作 Fiddle 从 ajax
代理类型重写为 memory
。我正在尝试手动加载 memory
存储数据:
// app/model/Employees.js file
Ext.define('Fiddle.model.Employees', {
extend: 'Ext.data.Model',
entityName: 'Employees',
fields: [
{
name: 'profile_pic'
},
{
type: 'int',
name: 'age'
},
{
type: 'string',
name: 'last',
mapping: 'name.last'
},
{
type: 'string',
name: 'first',
mapping: 'name.first'
},
{
type: 'string',
name: 'email'
}
],
proxy: {
type: 'memory',
reader: {
type: 'json',
rootProperty: 'items',
totalProperty: 'total',
successProperty: ''
}
}
});
// app/store/Employees.js file
Ext.define('Fiddle.store.Employees', {
extend: 'Ext.data.Store',
pageSize: 30, // items per page
alias: 'store.employees',
model: 'Fiddle.model.Employees',
});
//app.js fule - launch() function
var store = Ext.create('Fiddle.store.Employees');
console.log(store);
Ext.Ajax.request({
url: 'mates.json',
success: function(resp) {
var result = resp.responseText;
console.log(result);
// store.loadRawData(result);
store.loadData(result);
console.log(store);
console.log(store.getAt(0));
},
});
因此,我存储了 3386 条记录,每个符号都在我的 json 文件中。我在控制台中看到的第一条记录是:
我做错了什么?
我需要在哪里放置 proxy
线条 - 在模型中还是在商店中?
responseText
是一个字符串,其中包含序列化后的JSON数据。您必须先将其反序列化为一个对象,然后才能使用 loadRawData
通过模型转换器将对象加载到商店中:
var result = Ext.decode(resp.responseText);
store.loadRawData(result);
loadData
和 loadRawData
的不同之处在于 loadData
不调用模型上的转换器。 loadRawData
相当于 ajax 代理所做的,loadData
不是。
是这样做的:
//in Grid panel js file
listeners: {
afterrender: function(grid, evt) {
var myStore = grid.getStore();
Ext.Ajax.request({
url: 'mates.json',
success: function(resp) {
var result = Ext.decode(resp.responseText);
myStore.getProxy().data = result;
myStore.load();
},
});
}
}
店内 autoLoad: true
必须禁用。这种加载方式而不是 store.loadRawData(result);
显示 pagingtoolbar
.
中的正确记录数
我将我的工作 Fiddle 从 ajax
代理类型重写为 memory
。我正在尝试手动加载 memory
存储数据:
// app/model/Employees.js file
Ext.define('Fiddle.model.Employees', {
extend: 'Ext.data.Model',
entityName: 'Employees',
fields: [
{
name: 'profile_pic'
},
{
type: 'int',
name: 'age'
},
{
type: 'string',
name: 'last',
mapping: 'name.last'
},
{
type: 'string',
name: 'first',
mapping: 'name.first'
},
{
type: 'string',
name: 'email'
}
],
proxy: {
type: 'memory',
reader: {
type: 'json',
rootProperty: 'items',
totalProperty: 'total',
successProperty: ''
}
}
});
// app/store/Employees.js file
Ext.define('Fiddle.store.Employees', {
extend: 'Ext.data.Store',
pageSize: 30, // items per page
alias: 'store.employees',
model: 'Fiddle.model.Employees',
});
//app.js fule - launch() function
var store = Ext.create('Fiddle.store.Employees');
console.log(store);
Ext.Ajax.request({
url: 'mates.json',
success: function(resp) {
var result = resp.responseText;
console.log(result);
// store.loadRawData(result);
store.loadData(result);
console.log(store);
console.log(store.getAt(0));
},
});
因此,我存储了 3386 条记录,每个符号都在我的 json 文件中。我在控制台中看到的第一条记录是:
我做错了什么?
我需要在哪里放置 proxy
线条 - 在模型中还是在商店中?
responseText
是一个字符串,其中包含序列化后的JSON数据。您必须先将其反序列化为一个对象,然后才能使用 loadRawData
通过模型转换器将对象加载到商店中:
var result = Ext.decode(resp.responseText);
store.loadRawData(result);
loadData
和 loadRawData
的不同之处在于 loadData
不调用模型上的转换器。 loadRawData
相当于 ajax 代理所做的,loadData
不是。
是这样做的:
//in Grid panel js file
listeners: {
afterrender: function(grid, evt) {
var myStore = grid.getStore();
Ext.Ajax.request({
url: 'mates.json',
success: function(resp) {
var result = Ext.decode(resp.responseText);
myStore.getProxy().data = result;
myStore.load();
},
});
}
}
店内 autoLoad: true
必须禁用。这种加载方式而不是 store.loadRawData(result);
显示 pagingtoolbar
.