0

我应该如何以及在何处使用模态对话框功能定义区域或函数,以便我可以在视图中的一个或两个指定情况下加载它,例如 through MyApp.modal.show(content)

例子:

var ModalRegion = Backbone.Marionette.Region.extend({
  el: "#modal",

  constructor: function(){
    _.bindAll(this);
    Backbone.Marionette.Region.prototype.constructor.apply(this, arguments);
    this.on("view:show", this.showModal, this);
  },

  getEl: function(selector){
    var $el = $(selector);
    $el.on("hidden", this.close);
    return $el;
  },

  showModal: function(view){
    view.on("close", this.hideModal, this);
    this.$el.modal('show');
  },

  hideModal: function(){
    this.$el.modal('hide');
  }
});

在这个视图中如何使用它?

MyApp.Views.Layouts.Unauthenticated = Backbone.Marionette.Layout.extend({
  template: 'layouts/unauthenticated',

  regions: {
    //modal: ModalRegion, //Region must be specified as a selector string or an object with selector property
    tabContent: '#tab-content'
  },
  events: {
    'click #showLogin': 'showLogin'
  },
  views: {},
  showLogin: function(){
    this.views.login = BD.Views.Unauthenticated.Login;
    MyApp.modal.show(new this.views.login);
  },
4

1 回答 1

1

你可以用另外两种方式来做。

1)使用开源进行tw bootstrap这个并且没有bootstrap

2)如果你更喜欢自己的模式,我建议你自己做“基”类来定义你的抽象方法。咖啡脚本中的示例:

class MyApp.Views.Base.Modal extends Marionette.ItemView
  ... here is modal code like show etc.... just abstract class

class MyApp.views.model_custom extends MyApp.Views.Base.Modal
  ... and here is class with specific details of one modal like element, events, triggers etc...

在 JavaScript 中:

var MyApp.Views.Base.Modal = Backbone.Marionette.ItemView.extend({...}) 
var MyApp.views.model_custom = MyApp.Views.Base.Modal.extend({...}) 

强烈建议对 itemView 复合视图等所有类执行此操作,创建基类...

于 2013-08-20T20:21:29.800 回答