Extjs4: как обмениваться данными между несколькими магазинами или моделями?
Я новичок в Ext и изо всех сил пытаюсь выяснить магазины моделей и прокси.
Сервер возвращает один большой объект JSON. Например.
{
"responseHeader":{
"status":0,
"QTime":12,
"params":{
"facet":"true",
"facet.limit":"40"
}
},
"response":{
"numFound":3806,
"start":0,
"docs":[
{
//Lots of fields
"id":"1234",
...
//Some array properties
"testfield":[
"",
""
],
...
}
]
},
"facet_counts":{
"facet_queries":{
"email":3806
},
"facet_fields":{
"emailaddress":{
},
"subject":{
"candles":136,
"filter":130
},
"fromemail":{
},
//...
},
"facet_dates":{ },
"facet_ranges":{}
},
"highlighting":{
"some doc id":{
"emailtext":[ " Tel.: blah blah <em>blah</em>" ],
"combined":[ "<em>Email</em> To: blah blah blah" ]
}
}
}
Я не хочу загружать эти данные более одного раза, я хочу получить данные из этого объекта, например, объекта docs, и поместить их в сетку. Затем вытащите другую часть, чтобы положить ее в ящик выбора.
Как я могу загрузить эти данные один раз, и в то же время создать модели и хранилища, чтобы передать из них сетки и ящики выбора?
Из того, что я прочитал прокси держит ответ сервера? Поэтому я попытался создать прокси вне магазина. Думаю, что я мог бы использовать один и тот же прокси с более чем одним магазином.
var myProxy1 = Ext.create('Ext.data.proxy.Proxy', {
type: 'ajax',
url : '../test',
reader: {
type: 'json',
root: 'responseHeader'
}
});
Но когда я передаю myProxy1 в магазин
Ext.define('Test', {
extend: 'Ext.data.Model',
fields: [
{name: 'status', type: 'int'},
{name: 'QTime', type: 'int'},
{name: 'param', type: 'auto'}
]
});
var myStore = Ext.create('Ext.data.Store', {
model: 'Test',
proxy: myProxy1,
autoLoad: true,
listeners:{
load: function( ths, records, successful, operation, eOpts ){
debugger;
}
}
});
Не работает Событие загрузки никогда не запускается. Данные не загружены. Я вижу, что прокси сделал запрос, я вижу ответ от сервера, но он не загружается.
Если я вставляю прокси, он загружается.
var myStore = Ext.create('Ext.data.Store', {
model: 'Test',
proxy:{
type: 'ajax',
url : '../test',
reader: {
type: 'json',
root: 'responseHeader'
}
},
autoLoad: true,
listeners:{
load:function( ths, records, successful, operation, eOpts ){
debugger;
}
}
});
Я думал, что мог бы иметь один прокси-сервер, прикрепить его к нескольким магазинам и просто сменить на нем считыватель перед загрузкой магазина.
1 ответ
Вы в значительной степени там, и, хотя я почти уверен, что вы понимаете все это, в интересах других, позвольте мне дать расширенный ответ и слегка измененное решение вашей проблемы.
Определения:
- Модель - в первую очередь определяет поля, которые имеет запись.
- Магазин - содержит коллекцию записей.
- Прокси- сервер - облегчает взаимодействие с сервером с помощью выбранного метода (Ajax, Direct и т. Д.) И отображает операции CRUD (создание / чтение / обновление / уничтожение), когда это происходит в результате изменения в связанном хранилище или модели.
- Читатель - сообщает прокси, как интерпретировать данные, которые возвращает сервер.
- Сетка или Combobox - может отображать записи магазина.
Ваш сценарий не является чем-то необычным - хотя по умолчанию ExtJS загружает каждое хранилище отдельно, скорее всего, приложение предпочло бы, чтобы разные хранилища загружались одновременно с помощью одного вызова чтения; например, при рендеринге один магазин-зависимый компонент зависит от другого магазина.
Ваш код не за горами от этого, но вот как я это делаю. Фактически, когда загружается "главное" (Tasks) хранилище, ответ сервера также переносит данные "подчиненного" (тэга) хранилища, которое затем вручную загружается в это "ведомое" хранилище.
"Рабский магазин" (уведомление autoload: false
и нет операции чтения):
Ext.define('DL.store.Tags', {
extend: 'Ext.data.Store',
model: 'DL.model.Tag',
// Notice the tags are actually returned when the tasks are loaded and loaded into this store by the TasksStore.
autoLoad: false,
autoSync: true,
proxy: {
type: 'direct',
api: {
create: Tags.Create,
update: Tags.Update,
destroy: Tags.Destroy,
},
reader: {
type: 'json',
root: 'tags'
}
},
});
Затем "мастер" магазин:
Ext.define('DL.store.Tasks', {
extend: 'Ext.data.TreeStore',
model: 'DL.model.Task',
autoLoad: true,
autoSync: true,
root: {
text: 'Root',
id: null,
expanded: true
},
proxy: {
type: 'direct',
api: {
create: Tasks.Create,
read: Tasks.Read,
update: Tasks.Update,
destroy: Tasks.Destroy,
},
},
onProxyLoad: function( aOperation )
{
// A read request for tasks will also return the user tags.
// So feed these tags into their store.
var iResult = aOperation.response.result,
iTagsStore = Ext.StoreManager.lookup( 'Tags' );
if ( Ext.isDefined( iResult.tags ) )
iTagsStore.loadRawData( iResult );
// We need this line for "Tasks" store to load its own data
this.callParent(arguments);
}
});
По сути, все, что он делает, это принимает часть ответа сервера и загружает его вручную в "ведомое" хранилище.
Код серверной части PHP (для операции чтения задач) включает в себя:
return array(
'success' => true,
'children' => $iNodes,
'tags' => $iTags
);
куда children
является корнем читателя магазина 'master', и tags
это дополнительные данные, которые затем загружаются в "ведомое" хранилище.
Я надеюсь, что вы сможете понять, как применять эти концепции в вашем коде.