Sencha touch 无法在Sencha 1.1中扩展DataView

我正在尝试扩展Sencha 1.1 DataView，以便构建自己的选择器。然而，扩展不起作用。看起来它甚至都没有调用initComponent，每当我试图通过调用它的一个方法转向超类时，我都会收到一条消息，说明该方法不存在。我想我遗漏了一些关于如何扩展DataView的内容（尽管我几乎是逐字从Sencha源代码中复制的）

这是我的密码：

    Ext.MyDV = Ext.extend(Ext.DataView, {
                flex: 1,
                displayField: 'text',
                valueField: 'value',
                align: 'center',
                itemSelector: 'div.x-picker-item',

                componentCls: 'x-picker-slot',
                renderTpl : ['<div class="x-picker-mask">',
                                '<div class="x-picker-bar"></div>',
                             '</div>'
                            ],
                selectedIndex: 0,
                getElConfig: function() {
                    return {
                        tag: 'div',
                        id: this.id,
                        cls: 'x-picker-' + this.align
                    };
                },
                initComponent : function() {
                    Ext.apply(this.renderSelectors, {
                        mask: '.x-picker-mask',
                        bar: '.x-picker-bar'
                    });
                    this.scroll = {
                        direction: 'vertical',
                        useIndicators: false,
                        friction: 0.7,
                        acceleration: 25,
                        snapDuration: 200,
                        animationDuration: 200
                    };
                    this.tpl = new Ext.XTemplate([
                        '<tpl for=".">',
                            '<div class="x-picker-item {cls} <tpl if="extra">x-picker-invalid</tpl>">{' + this.displayField + '}</div>',
                        '</tpl>'
                    ]);

                    var data = this.data,
                        parsedData = [],
                        ln = data && data.length,
                        i, item, obj;

                    if (data && Ext.isArray(data) && ln) {
                        for (i = 0; i < ln; i++) {
                            item = data[i];
                            obj = {};
                            if (Ext.isArray(item)) {
                                obj[this.valueField] = item[0];
                                obj[this.displayField] = item[1];
                            }
                            else if (Ext.isString(item)) {
                                obj[this.valueField] = item;
                                obj[this.displayField] = item;
                            }
                            else if (Ext.isObject(item)) {
                                obj = item;
                            }
                            parsedData.push(obj);
                        }

                        this.store = new Ext.data.Store({
                            model: 'x-textvalue',
                            data: parsedData
                        });

                        this.tempStore = true;
                    }
                    else if (this.store) {
                        this.store = Ext.StoreMgr.lookup(this.store);
                    }

                    this.enableBubble('slotpick');

                    Ext.MyDV.superclass.initComponent.call(this);
                    if (this.value !== undefined) {
                        this.setValue(this.value, false);
                    }
                },
                setupBar: function() {
                    this.el.setStyle({padding: ''});

                    var padding = this.bar.getY() - this.el.getY();
                    this.barHeight = this.bar.getHeight();

                    this.el.setStyle({
                        padding: padding + 'px 0'
                    });
                    this.slotPadding = padding;
                    this.scroller.updateBoundary();
                    this.scroller.setSnap(this.barHeight);
                    this.setSelectedNode(this.selectedIndex, false);
                },

                afterComponentLayout: function() {
                    // Dont call superclass afterComponentLayout since we dont want
                    // the scroller to get a min-height
                    Ext.defer(this.setupBar, 200, this);
                },
                initEvents: function() {
                    this.mon(this.scroller, {
                        scrollend: this.onScrollEnd,
                        scope: this
                    });
                },
                onScrollEnd: function(scroller, offset) {
                    this.selectedNode = this.getNode(Math.round(offset.y / this.barHeight));
                    this.selectedIndex = this.indexOf(this.selectedNode);
                    this.fireEvent('slotpick', this, this.getValue(), this.selectedNode);
                },

                /**
                 * @private
                 */
                scrollToNode: function(node, animate) {
                    var offsetsToBody = Ext.fly(node).getOffsetsTo(this.scrollEl)[1];
                    this.scroller.scrollTo({
                        y: offsetsToBody
                    }, animate !== false ? true : false);
                },

                /**
                 * @private
                 * Called when an item has been tapped
                 */
                onItemTap: function(node, item, index) {
                    Ext.MyDV.superclass.onItemTap.apply(this, arguments);
                    this.setSelectedNode(index);

                    this.selectedNode = item;
                    this.selectedIndex = index;
                    this.fireEvent('slotpick', this, this.getValue(), this.selectedNode);
                },
                getSelectedNode: function() {
                    return this.selectedNode;
                },

                setSelectedNode: function(selected, animate) {
                    // If it is a number, we assume we are dealing with an index
                    if (Ext.isNumber(selected)) {
                        selected = this.getNode(selected);
                    }
                    else if (selected.isModel) {
                        selected = this.getNode(this.store.indexOf(selected));
                    }

                    // If its not a model or a number, we assume its a node
                    if (selected) {
                        this.selectedNode = selected;
                        this.selectedIndex = this.indexOf(selected);
                        this.scrollToNode(selected, animate);
                    }
                },

                getValue: function() {
                    var record = this.store.getAt(this.selectedIndex);
                    return record ? record.get(this.valueField) : null;
                },

                setValue: function(value, animate) {
                    var index = this.store.find(this.valueField, value);
                    if (index != -1) {
                        if (!this.rendered) {
                            this.selectedIndex = index;
                            return;
                        }
                        this.setSelectedNode(index, animate);
                    }
                },

                onDestroy: function() {
                    if (this.tempStore) {
                        this.store.destroyStore();
                        this.store = null;
                    }
                    Ext.MyDV.superclass.onDestroy.call(this);
                }   
            });

Ext.MyDV=Ext.extend（Ext.DataView{
弹性：1，
显示字段：“文本”，
valueField:'值'，
对齐：'居中'，
项目选择器：“div.x-picker-item”，
组件CLS:'x-picker-slot'，
renderTpl:[''，
'',
''
],
已选择索引：0，
getElConfig:function（）{
返回{
标签：“div”，
id:this.id，
cls:'x-picker-'+this.align
};
},
initComponent:function（）{
Ext.apply（this.renderselector{
掩码：'.x-picker-mask'，
条形图：'.x-picker-bar'
});
此项。滚动={
方向：'垂直'，
useIndicators:false，
摩擦力：0.7，
加速度：25，
持续时间：200，
动画持续时间：200
};
this.tpl=new Ext.XTemplate([
'',
“{'+this.displayField+'}”，
''
]);
var data=此.data，
parsedData=[]，
ln=数据和数据长度，
i、 项目，obj；
if（数据和外部isArray（数据）和ln）{
对于（i=0；i