文本字段EXTJS中的箭头键导航问题

Ext.create('Ext.form.Panel', {
    title: 'Arrow Key Navigation',
    width: 400,
    bodyPadding: 10,
    renderTo: Ext.getBody(),
    items: [{
        xtype: 'textfield',
        fieldLabel: 'Field 1',
        enableKeyEvents: true,
        listeners: {
            specialkey: function(field, e){
                if (e.getKey() === e.ENTER) {
                    // 处理回车键事件
                } else if (e.getKey() === e.UP) {
                    // 处理上箭头键事件
                } else if (e.getKey() === e.DOWN) {
                    // 处理下箭头键事件
                }
            }
        }
    }, {
        xtype: 'textfield',
        fieldLabel: 'Field 2',
        enableKeyEvents: true,
        listeners: {
            specialkey: function(field, e){
                if (e.getKey() === e.ENTER) {
                    // 处理回车键事件
                } else if (e.getKey() === e.UP) {
                    // 处理上箭头键事件
                } else if (e.getKey() === e.DOWN) {
                    // 处理下箭头键事件
                }
            }
        }
    }]
});