javascript - Ext.getCmp と Ext.ComponentQuery.query は同じオブジェクトを返しますが、使用すると同じ結果が得られません

Question

グリッド用に 1 つと、グリッドで新規追加がクリックされたときに開かれるフォーム用に 2 つのクラスを定義しました。

グリッドビュー クラス

Ext.define('CustomerApp.view.CustomerGridView',
 {
     extend: 'Ext.container.Viewport',
     renderTo: Ext.getBody(),
     itemId: 'gridView'});

フォームクラス

  Ext.define('CustomerApp.view.FormWindow',

     {
     extend : 'Ext.window.Window',
     closable:true,
     itemId: 'addCustomerWindow'})

グリッドで追加ボタンを押すと、ウィンドウが開いてフォームが表示されます。

フォームを表示するコード

     AddCustomer: function()
                        {
                        var win = Ext.create('CustomerApp.view.FormWindow');
                        Ext.ComponentQuery.query('#gridView')[0].add(win);
                        win.show();

                        }

フォームで送信をクリックした後、顧客を追加してフォームを閉じる必要があります。Ext.getCmp を使用すると閉じますが、コンポーネント クエリを使用すると閉じません。

フォームを閉じるコード:

    var gridView = Ext.getCmp('gridView');
    //var gridView= Ext.getComponentQuery.query('#gridView')[0];

    var formWindow = Ext.getCmp('addCustomerWindow');
    //var formWindow=Ext.getComponentQuery.query('#addCustomerWindow')[0];

    gridView.remove(formWindow);

コンソールで確認しましたが、どちらも同じオブジェクトを返していますが、Ext.getCmp() を使用するとフォームは閉じられますが、Ext.ComponentQuery.query() は閉じられません。