Javascript ExtJS：在关注TextArea时显示/隐藏其他组件

我的UI中有一个文本区域和一个日期选择器。每当TextArea接收到焦点时，我试图显示/隐藏日期选择器。下面是代码片段：

/*global Ext:false */
Ext.onReady(function () {
     var textArea = Ext.create('Ext.form.field.TextArea', {
      width: 200,
      height: 20,
      renderTo: Ext.getBody(),

       listeners: {
         'focus': function() {
            var datePicker = Ext.ComponentQuery.query('#datepicker')[0];

            if (datePicker.isVisible())
                datePicker.hide();
            else
                datePicker.show();
         }
       }
    });

  var datePicker = Ext.create('Ext.menu.DatePicker', {
        renderTo: Ext.getBody(),
        itemId: 'datepicker',

        handler: function (dp, date) {
              textArea.setValue ('You selected ' + Ext.Date.format(date, 'M j, Y'));
        }
    });
});

最初，DatePicker是可见的，因此“focus”事件的回调代码执行得很好，并且隐藏了DatePicker。但是，当TextArea第二次接收到焦点时，我得到以下错误：

TypeError: 'undefined' is not an object (evaluating 'D[z.parallelBefore]')
calculateChildBoxesext-all.js:15:353261
onLayoutext-all.js:15:356219
layoutext-all.js:15:233311
doLayoutext-all.js:15:316709
showext-all.js:15:310075
focusapp.js:15
fireext-all.js:15:241297
continueFireEventext-all.js:15:159467
fireEventext-all.js:15:159245
onFocusext-all.js:15:756851
callParentext-all.js:15:65228
onFocusext-all.js:15:760411
anonymous
cext-all.js:15:127065
app.js:23

---

我认为错误在“focus”函数回调中，但我不确定如何修复它。我是一个ExtJS/Sencha noob。有什么想法吗？

我复制并粘贴了你发布的代码，没有问题。。。您使用的浏览器和版本是什么？啊，没关系。我在4.0.7版上试用时，代码被窃听了。我在这里的4.2.0中试用过，效果很好。谢谢。