只打開一個彈出窗口（面板）

所以我有這個函數onDisplayError這是每次調用如果請求失敗。這意味着如果用戶按保存按鈕和3請求失敗，我目前得到3彈出消息。我的目標是這個函數檢查我的彈出窗口是否已經打開。如果是的話，我會在我的已經打開的窗口中追加的錯誤，否則就應該打開這個錯誤彈出只打開一個彈出窗口（面板）

onDisplayError: function (response, message) { 
     var errorPanel = Ext.create('myApp.view.popup.error.Panel',{ 
      shortMessage: message, 
      trace: response 
     }); 
     if(errorPanel.rendered == true){ 
      console.log('Do some other stuff'); 
     }else{ 
      errorPanel.show(); 
     } 
    },

這是Panel.js

Ext.define('myApp.view.popup.error.Panel', { 
    extend: 'Ext.panel.Panel', 
    requires: [ 
     'myApp.view.popup.error.PanelController' 
    ], 
    controller: 'myApp_view_popup_error_PanelController', 

    title: 'Fail', 
    glyph: '[email protected]', 

    floating: true, 
    draggable: true, 
    modal: true, 
    closable: true, 
    buttonAlign: 'center', 
    layout: 'border', 
    shortMessage: false, 
    width: 800, 
    height: 200, 

    initComponent: function() { 
     this.items = [ 
      this.getMessagePanel(), 
      this.getDetailsPanel() 
     ]; 
     this.callParent(arguments); 
    }, 

    getMessagePanel: function() { 
     if(!this.messagePanel) { 
      var message = this.shortMessage; 
      this.messagePanel = Ext.create('Ext.panel.Panel', { 
       bodyPadding: 5, 
       height: 200, 
       region: 'center', 
       border: false, 
       html: message 
      }); 
     } 
     return this.messagePanel; 
    }, 

    getDetailsPanel: function() { 
     if(!this.detailsPanel) { 
      this.detailsPanel = Ext.create('Ext.panel.Panel', { 
       title: 'Details', 
       hidden: true, 
       region: 'south', 
       scrollable: true, 
       bodyPadding: 5, 
       height: 400, 
       html: '<pre>' + JSON.stringify(this.trace, null, 4) + '</pre>' 
      }); 
     } 
     return this.detailsPanel; 
    }

的問題是，我仍然獲得多個彈出窗口顯示。我認爲問題在於var errorPanel失去了引用，所以無法檢查這個彈出（面板）是否已經打開。如何達到預期效果？我正在使用extjs 6.如果您需要任何其他信息，請讓我知道，我會提供。

來源

2016-11-14 Valor_

你可以提供給您的組件定義的特殊xtype

Ext.define('myApp.view.popup.error.Panel', { 
    extend: 'Ext.panel.Panel', 
    xtype:'myxtype'

。

，然後你可以有一個非常濃縮的onDisplayError功能：

onDisplayError: function (response, message) { 
    var errorPanel = Ext.ComponentQuery.query('myxtype')[0] || Ext.widget('myxtype'); 
    errorPanel.appendError(message, response) 
    errorPanel.show(); 
},

面板的initComponent功能應該初始化一個空的窗口，並appendError應該包含你的邏輯追加一個錯誤（這可能是第一個錯誤，以及第二個或第三個）到面板中的錯誤列表。

來源

2016-11-14 12:13:39 Alexander

太棒了！謝謝！ –

使用Ext.create將始終創建該類的新實例。

您可以使用參考配置創建面板的唯一引用。然後，在控制器中使用this.lookupReference（'referenceName'）來檢查面板是否已經存在，並使用show（）。

您還必須在面板中設置closeAction：'hide'，以避免面板在關閉時被破壞。

否則，可以參考保存到面板控制器

this.errorPanel = Ext.create（ 'myApp.view.popup.error.Panel' ....

然後，如果（this.errorPanel）this.errorPanel.show（）; 否則this.errorPanel = Ext.create ...

來源

2016-11-14 12:10:17 fradal83

只打開一個彈出窗口（面板）

回答

相關問題