Sencha将自定义列表触摸到视口中

Question

I am having some problems adding my custom list view into the viewport. If i use the example from the documentation like the lines below it works fine

Ext.Viewport.add(Ext.create('Ext.List', {
store: {
    fields: ['name'],
    data: [
        {name: 'Cowper'},
        {name: 'Everett'},
        {name: 'University'},
        {name: 'Forest'}
    ]
},

itemTpl: '{name}'
}));

If i define my own list and then try to add it it does not work. What am I doing wrong?

Ext.define('MyList', {
    extend: 'Ext.List',
    store: 
    { fields: ['name'],
      data: [{name: 'Cowper'},
            {name: 'Everett'},
            {name: 'University'},
            {name: 'Forest'}],
    },
    itemTpl: '{name}'});
Ext.Viewport.add(Ext.create('MyList'));

Answer 1

When you define view, you should put view configuration inside config.

Try this

Ext.define('MyList',{
        extend: 'Ext.List',
        config: {
            store: { 
                fields: ['name'],
                data: [{name: 'Cowper'},
                {name: 'Everett'},
                {name: 'University'},
                {name: 'Forest'}],
            },
            itemTpl: '{name}'
       }
});

Ext.Viewport.add(Ext.create('MyList'));