2013-08-29 1 views
1

У меня есть панель инструментов уведомлений, которая является модулем. Очень похоже на панель уведомлений в родном приложении facebook. В этой панели находятся 3 области:Как расширить модуль MarionetteJS для уменьшения дублирования кода

  • InvitesRegion
  • RequestsRegion
  • NotificationsRegion

Каждая из этих областей содержит свой собственный модуль (InvitesModule, RequestsModule, NotificationsModule). Каждый из них, однако, имеет точно такую ​​же функциональность:

  • Проверьте сервер для новых (ПРИГЛАШАЕТ | Запросы | Уведомления)
  • Если обнаружено, обновить соответствующий регион
  • А потом целую кучу других функций (нажмите, чтобы всплывать в коллекцииView и т. д.)

Могу ли я написать единый модуль, скажем, InvitesModule, и у меня есть два других модуля, расширяющих этот модуль, чтобы я мог просто перезаписать переменную, которая мне нужна?

Спасибо и пожалуйста, дайте мне знать, если я могу быть более ясным

ответ

5

Ну да, да, можно! Хотя Marionette точно не позволяет вам создать «базовый модуль» как таковой, он позволяет вам изменять существующий модуль. Мы воспользовались этим в нашем приложении для создания определения ModuleDefaults, которое мы используем для всех шаблонов. Вот как это работает:

var ModuleDefaults = { 
    // Define baseline behavior to share among all modules 
    definition: function() { 
    this.foo = 'bar'; 

    this.addInitializer(function() { 
     console.log(this.moduleName + ': do startup stuff'); 
    }); 
    } 
}; 

Теперь вы можете создавать модули, которые просто реализовать такое поведение следующим образом:

// Create a module with the default implementation 
App.module('Module1', ModuleDefaults.definition); 

Или вы можете создать модуль, который переопределяет этот bevavior:

// Create another module with the default implementation 
App.module('Module2', ModuleDefaults.definition); 

// Provide customizations to second module: 
App.module('Module2', function() { 
    // override existing behavior 
    this.foo = 'baz'; 

    // add new behavior 
    this.addFinalizer(function() { 
    console.log(this.moduleName + ': cleanup stuff'); 
    }); 
}); 

Используя эту технику, докажите, что свойство второго модуля переопределено:

App.start();     // -> Module1: do startup stuff 
           // -> Module2: do startup stuff 
console.log(App.Module1.foo); // -> bar 
console.log(App.Module2.foo); // -> baz 
App.Module1.stop();   // -> 
App.Module2.stop();   // -> Module2: cleanup stuff 
+0

Крис, спасибо, что нашли время, чтобы показать мне. Это отличное решение. – validkeys

+0

Не проблема. :) –