2011-02-08 3 views
5

У меня вопрос о множественном наследовании в ExtJS. Хотя я знаю, что могу просто дублировать код, чтобы это произошло, но я хочу знать, есть ли способ более эффективно его кодировать.Extjs множественное наследование?

У меня есть настраиваемый компонент GridPanel в моей структуре, называемый Kore.ux.grid.GridPanel. Он расширяет Ext.GridPanel с более распространенными функциями и обеспечивает интерфейс для действий REST.

Вскоре позже мой коллега хотел, чтобы он также был реализован таким же образом, то есть она хочет, чтобы он был доступен для редактирования и в то же время имел возможность легко выполнять действия REST.

Мой вопрос: есть ли способ продлить Ext.EditorGridPanel, чтобы подгонять настроенные функции Kore.ux.grid.GridPanel?

Извините за любые ошибки грамматики, и я могу перефразировать его, если это сбивает с толку. Благодаря!!

EDIT

Я снова гугл, и я нашел темы, говоря, что это невозможно. Есть ли какой-нибудь лучший шаблон кодирования, который я должен соблюдать, если у меня есть эта проблема?

Спасибо!

EDIT СНОВА

Так жаль, что я нашел структуру, которая подходит мне .. Вот метод, который я нашел полезным для меня:

var Common = function(){} //abstract class 
Ext.apply(Common.prototype, { 

    a : function(){}, 
    b: function(){}... 

}); 

Ext.ux.SomePanelA = Ext.extend (Ext.Panel, { 

    stuff : ............ 

}); 

Ext.ux.SomePanelB = Ext.extend (Ext.Panel, { 

    diffStuff : ............ 

}); 

Ext.applyIf(Ext.ux.SomePanelA.prototype, Common.prototype); 
Ext.apply(Ext.ux.SomePanelB.prototype, Common.prototype); 

Код Источник: http://www.sencha.com/forum/showthread.php?48000-multiple-inheritance&p=228271&viewfull=1#post228271

Пожалуйста, снова дайте полезные советы, если вы считаете, что у вас лучшее решение :) Спасибо!

ответ

5

Что вам действительно нужно изучить, это плагины ExtJS.

/** 
* Boilerplate code taken from 'ExtJS in Action' by Jay Garcia 
*/ 
YourNameSpace.RestGridPlugin = Ext.extend(Object, { 
    constructor : function(config) { 
    config = config || {}; 
    Ext.apply(this.config); 
    }, 

    init : function(parent) { //parent argument here, is whatever you apply your plugin to 
    parent.on('destroy', this.onDestroy, this); 
    Ext.apply(parent, this.parentOverrides); 
    }, 

    onDestroy : function() { 
    //here you need to free any resources created by this plugin 
    }, 

    parentOverrides : { 
    //here you do your magic (add functionality to GridPanel) 
    } 

}); 

Ext.preg('restgridplugin',YourNameSpace.RestGridPlugin); //register your brand ne plugin 

Использование

someGrid = { 
    xtype: 'grid', 
    columns: ... 
    store: ... 
    plugins: [ 
    'restgridplugin' 
    ] 
} 

someEditorGrid = { 
    xtype: 'editorgrid', 
    columns: ... 
    store: ... 
    plugins: [ 
    'restgridplugin' 
    ] 
} 
+0

PLUGIN! Почему я забыл о его существовании !! Спасибо за предложение :) Посмотрите, как я включу его в рамки.Спасибо :) –

+0

Но это может не соответствовать моему делу, так как мой настраиваемый GridPanel предоставляет настраиваемый pagingToolbar, предопределенные кнопки, поле поиска, REST ... и т. Д. Плагин может быть не таким :) Спасибо за предложение в любом случае! –

+0

Почему бы и нет? Вы можете получить доступ к этим настраиваемым компонентам из плагина, чтобы привязать к ним свои функции. В конце концов, то, что делает плагин, на самом деле является 'Ext.apply()' именно так, как вы это делаете сейчас. Он просто добавляет немного более надежный и простой в использовании API для этого. – Mchl

0

Создать Kore.ux.grid.AbstractGridPanel как базовый класс с общей функциональностью. И создайте два дочерних класса: Kore.ux.grid.GridPanel и Kore.ux.grid.EditorGridPanel (с определенной функциональностью).

+0

Дела в том, '' Ext.grid.EditorGridPanel' расширяет Ext.grid.GridPanel', остальные «Интерфейс», который я предоставил, расширяет «Ext.grid.GridPanel», и поскольку мне нужны функциональные возможности, предусмотренные в «Ext.grid.EditorGridPanel», я думаю, что лучший способ - написать общий базовый класс и расширить оба параметра «Ext.grid» .GridPanel' и 'Ext.grid.EditorGridPanel' с общим базовым классом. Спасибо за вход так или иначе :) –

0

Я не согласен с использованием плагинов для выполнения множественного наследования в Ext. Плагины предназначены для изменения поведения или добавления новых функций.

Правильный путь для достижения множественного наследования является использованием Примеси, пожалуйста, смотрите это удивительное объяснение SenchaCon 2011: The Sencha Class System

Ext.define('FunctionalityA', { 
    methodA: function() { 
     ... 
    } 
}); 

Ext.define('FunctionalityB', { 
    methodB: function() { 

    } 
}); 

Ext.define('MultipleFunctionality', { 
    mixins: [ 
     'FunctionalityA', 
     'FunctionalityB' 
    ], 

    method: function() { 
     methodA(); 
     methodB(); 
    } 
}); 
Смежные вопросы