Preview new functions of extjs 4.0 (4): new store/Proxy

New store/Proxy

Reprinted please indicate the sourceEXTHttp://www.ajaxjs.com.

As mentioned above, ext JS4 allows us to define the association between business models. On the browser client, we can describe how our business models are and even flexibly call domain objects) it is not difficult either. However, if Entity Data is not used, the business model is just an empty shell, and there is no "UI data binding" in the absence of content. Of course, in ext, we can call schmea for the model.
The key question for matching data is how to do it? Obviously, the browser client may never have its own physical data, but it still gets data from the server or localstorage. the browser or client memory is the "Data Transfer Station", which is well understood. EXT stipulates that after raw data is prepared, the proxy object is responsible for filling the actual data in the model ...... As for the proxy, we have been there for a long time. We are no stranger, but in the past, the proxy was dealing with store directly. Now, because of the emergence of model, the interaction to the model does not need to be processed to the store. But the store does not disappear, but internally
The API is automatically created and the store still exists. We can think that, due to the intervention of the model and the re-coordination of the proxy, the two results make the store role more explicit. It can be said that the meaning of store as a place to store data content is more obvious, simply put, it is equivalent to a data warehouse.

Compared with the old ext (3.0/2.0/1.0), it is worth mentioning that the record is relatively simple. However, to compare the differences between the old record graph and the old record graph, we can paste it as follows. Previously, the store was created mainly around proxy/reader. It can be said that proxy/reader is the object on which store depends, and the content includes how to obtain the definition data layer, how to parse ......

4.0. The following figure shows the components of the model. The new version is marked in blue. I have already introduced it to you in the previous period. Now there are still store and proxy ......

The second data is the store. Let's start with the introduction of the store!

Store

A model is a data model, while a store is a data container. From the database perspective, the store class encapsulates the cache of record objects of a client, providing data portals for UI components such as gridpanel, tree, And dataview. 4.0 of the store is much simplified and refreshing. It is fixed as a reflection of the surface, however, I think this is the result of proxy, Reader/writer's finer division of duties and model introduction. More strictly speaking, store is called "Ext. Data. abstractstore" in ext 4, which represents Abstract
Store is responsible for coupling with proxy and reader, but does not store any Entity Data Representation. That is to say, abstractstore is only some of the common content of coupling between objects. For example, the real data area varies according to different components. For example, store is Ext. util. mixedcollection, and the tree component is Ext. data. tree.

Take the most common jsonstore as an example. The general usage is as follows:

The sample code for edit may be different from the EXT model of the latest version, but it does not affect the main meaning-thanks to Qiuqiu/Sun.

VaR store = new Ext. data. jsonstore ({<br/> // store configs <br/> autodestroy: True, <br/> storeid: 'mystore' </P> <p> Proxy: {<br/> type: 'ajax ', <br/> URL: 'Get-images. PHP ', <br/> reader: {<br/> type: 'json', <br/> root: 'images', <br/> idproperty: 'name' <br/>}< br/>}, </P> <p> // optional. You can also specify the model name <br/> fields: ['name', 'url', {Name: 'SIZE', type: 'float'}, {Name: 'lastmod', type: 'date'}] <br/> });

The sample data is as follows:

{<Br/> images: [<br/> {Name: 'imagone', URL: '/getimage. php? Id = 1', size: 46.5, lastmod: new date (2007, 10, 29) },< br/> {Name: 'image two', URL: '/getimage. PHP? Id = 2', size: 43.2, lastmod: new date (2007, 10, 30)} <br/>] <br/>}

We can use APIs to directly understand the new store structure. The first is the store configuration item:

EXT provides sort and filter objects to solve sorting and Data Filtering Problems. The following method describes the sort/fitler method:

Ext. Data. abstractstore inherits from Ext. util. observable. It uses the observer to broadcast messages (pub/Sub) to communicate with other components. The store event is as follows:

As for paging, ext 4 remains unchanged and is still controlled through store.

 

Continue. Proxy introduction.

Reprinted please indicate the sourceEXTHttp://www.ajaxjs.com ).