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 это дополнительные данные, которые затем загружаются в "ведомое" хранилище.

Я надеюсь, что вы сможете понять, как применять эти концепции в вашем коде.

Другие вопросы по тегам