extjs - 将 ExtJs3 转换为 ExtJs4？

Question

这源于我之前的问题。
我已经使用 ExtJs 3.x 开发了大约一年，我想迁移到 ExtJs4。
我习惯于编码我的 extJs 文件，如下所示：

ReportsPanel = function(config){
config = config || {};

    function dummyFunction(){
       //I would usually have methods in this file also.
    }

    Ext.apply(config, {
      title: 'Reports',
      layout: 'border',
      id: 'reportsPanel',
      closable: 'true',
      items: []
    });

  ReportsPanel.superclass.constructor.call(this, config);
};
Ext.extend(ReportsPanel, Ext.Panel, {
    dummy: dummyFunction//Make the dummy function available to call
});

并在必要的地方实例化它new ReportsPanel()。

我看过许多不同的 ExtJs 4 代码示例，老实说我有点困惑。
我知道我应该使用该Ext.define方法。我似乎无法理解它。
上面的例子转换成 ExtJs4 应该是什么样子？

Answer 1

它可能看起来像这样：

Ext.define('ReportsPanel', {
    extend: 'Ext.panel.Panel',

    // default parameters
    title: 'Reports',
    layout: 'border',
    closable: true,

    // custom variables.
    foo: 'my var',
    bar: 'baz',

    constructor: function(config) {
        // ... do something in constructor if you need.


        this.callParent(arguments);
    },

    dummyFunction: function(){
        this.foo = 'bar';
        this.bar = 'my var';
    }
});