Best practice to have the same look and store multiple times in ExtJS 4

Question

I would like to have different instances of the same view in different stores at the same time in the ExtJS application. Currently, I see several instances of the same view (Ext.view.View) in the viewport.

But what is the best practice to have another store in all views? Each example I found uses a Store-ID in a view that was created using the store-Config controller. But for each show, he will use the same store.

At the moment, I understood the following possible solutions:

• Create your own storage class for each instance of the view. Add all stores to the controller and use a different Store-ID for each instance of the view.
• Do not use the controller stores at all and create a new repository in the initComponent view, manually passing different parameters to each repository instance.
• Do not use controller stores at all and create a new repository in the initComponent view manually. Then use the load to load the store manually, using different parameters for each store instance.

Is any of these decisions the best practice or should it be done differently?

Answer 1

The thing with the array of controller stores is that it will override any storeId . After loading the storage class, the controller sets storeId by namespace convention, creates the storage, and creates the getter method using the value as soreId .

Let me enter option 4

• Define one store for the view and require it in the view (you can also require it in the controller, just use the requires array).
• Select valid itemId for views and a valid storeId for your store, which should depend on the itemId view (set it when creating the view!).
• In initComponent create a storeId and find the store in the StoreManager. If it does not exist, create it and supply the client configuration and storeId .

If you need to destroy the show and the store every time, check out this post.

InitComponent demo

 initComponent: function() { var me = this, storeId = me.storeId + me.itemId; me.store = Ext.StoreManager.lookup(storeId); if(me.store === null) me.store = Ext.create('App.data.CustomViewStore',Ext.apply({storeId: storeId},me.storeCfg || {})); me.callParent(arguments); } 

Note. If you load a view using the views array, you will get a receiver that might not give you the expected view. Here you can also use the required controller array. If you want to use getter, just create your own using refs config.