Alias replaces ItemId on a component?

Question

I was reading the document and it states that setting an alias in the form of

   'widget.xxx.yyy' 

then the xtype would be automatically set to

   'xxx.yyy'

The problem I am having is that I have set up an alias and an itemId. It seems that the itemId is taking what is in the alias minus the widget. part.

Here's an example

Ext.define('TestApp.view.product.Panel', {
    extend : 'Ext.grid.Panel',
    alias: 'widget.productPanel',
    itemId: 'miscProductPanel',

So I am checking with the debugger and I notice the alias is correct, but the itemId seems to be now equal to "productPanel" and NOT "miscProductPanel".

Can anyone confirm what is happening ?

What's the real point of creating an alias ? Is there advantages of creating an alias. As far as I can see it seems to overwrite the itemID which I wasn't able to find in the documentation that this was a side affect?

Answer 1

the alias is used as xtype while you create an object. ItemId is used to manage different objects of the same type.

for instance:

Ext.define('MyApp.MyNewButton', {
   extend : 'Ext.button.Button',
   alias: 'widget.myNewButton'
   ...
});

When I create my button on a panel I will do:

var myPanel = Ext.create('Ext.panel.Panel',{
    ...
    ...
    items:[{
       xtype:'myNewButton',
       itemId:'startBtn'
    },{
       xtype:'myNewButton',
       itemId:'stoptBtn'
    }]
});

You can use itemId to get each button. For instance:

var startBtn = myPanel.down('myNewButton[itemId="startBtn"]');
var stopBtn = myPanel.down('myNewButton[itemId="stopBtn"]');