Ext.define()

Question

में initComponent() से संबंधित सर्वोत्तम अभ्यास Ext.define() का उपयोग करके मैं एक्स्टजेस के नए एमवीसी फैशन में अपने सभी घटकों को लिख रहा हूं।

मैं थोड़ा सा संघर्ष करता हूं कि initComponent() के अंदर गुणों को परिभाषित करें या बस उन्हें property: 42, की तरह सेट करें।

क्या व्यापक रूप से सर्वोत्तम प्रथाओं को स्वीकार किया जाता है?

मैं initComponent() का उपयोग कर के बीच चौंका देने वाला हूँ केवल जब आवश्यक (यानी। जब मैं कुछ गतिशील या एक गुंजाइश सेट चाहते हैं) जो समारोह में कम रहता है और मुझे पुर्जों कुछ बदसूरत this. रों और यह हमेशा जो लाभ है, कि मैं का उपयोग कर 'पूर्व गुणों को initComponent() पर कभी भी स्थानांतरित नहीं करना है क्योंकि मैं इसे और अधिक गतिशील बनाना चाहता हूं।

दुर्भाग्यवश, सेन्चा के दस्तावेज़ इसके बारे में बहुत कुछ नहीं बताते हैं और उपलब्ध उदाहरण ऐसा करने लगते हैं जैसे वे चाहते हैं।

Answer 1

व्यक्तिगत अभ्यास, मैं गुण क्षेत्र में चर घोषणा करेंगे जब

• चर परिमाण को परिभाषित करने, x, y, width की तरह, height
• चर का इंतजार कर ओवरराइड करने के लिए, या अनुकूलन , title, saveBtnTxt, url, fields, iconCls
• कुछ स्थिरांक, विशेष उपसर्गों इतना होगा कि इतने अधिरोहित जा नहीं होगा आसानी से

तब मैं घोषणा करेंगे items, listeners, this.on, Ext.apply(me, {..}) या कुछ भी है कि obj (this, me) के दायरे की आवश्यकता है, बैठने के लिए मेरे initComponent के अंदर। या सामान जो कुछ भी स्थापित करने से पहले संशोधित/ओवरराइड किया जाना चाहिए, इसलिए उपयोगकर्ता कुछ महत्वपूर्ण चरों को ओवरराइड करके मेरे घटक को तोड़ नहीं देगा।

बेशक यह मेरे मार्गदर्शन के रूप में कार्य करेगा। 2 सेंट

संपादित

बारे में बदसूरत this, मैं अपने अनुप्रयोग में चर me व्यापक रूप से इस्तेमाल किया है, और यह this की तुलना में बहुत क्लीनर लग रहा है। यह मुझे कम से कम स्कॉप्स को बदलने से भी लाभान्वित करता है।

Answer 2

मुझे आपका प्रश्न बिल्कुल नहीं मिल रहा है लेकिन यह आपके लिए उपयोगी हो सकता है।

Ext.define('My.Group', { 
// extend: 'Ext.form.FieldSet', 
xtype : 'fieldset', 
config : { 
    title : 'Group' + i.toString(), 
    id : '_group-' + i.toString() 

}, 
constructor : function(config) { 
    this.initConfig(config); 

    return this; 
},  
collapsible: true, 
autoScroll:true, 
..... 
}); 

आप इसका अनुसरण कर सकते हैं।

handler : function() {      
     i = i + 1; 
     var group = new My.Group({ 
      title : 'Group' + i.toString(), 
      id : '_group-' + i.toString() 
     }); 
     // console.log(this); 
     // console.log(group); 
     Ext.getCmp('panelid').insert(i, group); 
     Ext.getCmp('panelid').doLayout(); 
    } 

Answer 3

मैं लियोनेल के जवाब में जोड़ना चाहता हूं कि गैर-आदिमinitComponent में कॉन्फ़िगर करना बेहतर है। (आदिम से मेरा मतलब स्ट्रिंग, बुलियन और संख्या है)। ऐरे और ऑब्जेक्ट initComponent में जाएं।
तो परिभाषा इस तरह दिखना चाहिए:

Ext.define('My.NewClass', { 
    extend: 'OldClass', 
    // here all primitive configs: 
    cls: 'x-my-cls', 
    collapsible: true, 
    region: 'west', 
    // and so on ... 

    initComponent: function() { 
    // here you declare non-primitive configs: 
    this.tbar = [/* blah-blah */]; 
    this.columns = [/* blah-blah */]; 
    this.viewConfig = {/* blah-blah */}; 
    // and so on ... 

    this.callParent(arguments); 
    } 

    // other stuff 
} 

कारण है कि आप initComponent में सभी गैर-आदिम कॉन्फ़िगरेशन रखना चाहिए कि अन्यथा सभी उदाहरणों के कॉन्फ़िगरेशन ही वस्तुओं का उल्लेख नहीं है। उदाहरण के लिए यदि आप NewClass परिभाषित की तरह:

Ext.define('My.NewClass', { 
    extend: 'OldClass', 
    bbar: Ext.create('Ext.toolbar.Toolbar', { 
    // ... 

bbar सभी उदाहरणों की रों एक ही वस्तु के पास भेजेगा। और इसलिए हर बार जब आप नया उदाहरण बनाते हैं तो बीबार पूर्ववर्ती उदाहरण से गायब हो जाता है।