Question

我的应用程序中的许多视图都需要“可折叠”。对用户而言，这意味着您可以单击箭头以折叠或展开视图的内容。

创建视图时，我需要能够轻松地说“此视图应该是可折叠的”，然后运行相应的设置代码（这实际上意味着将.collapsible类添加到视图的包装器并插入看起来像这样的dom元素：<div class="toggle"></div>

有关如何无缝取消此功能的建议？我目前正在使用Backbone，Backbone.Marionette和Underscore。

我使用另一个不使用Backbone的应用程序执行此操作。在该应用程序中，每个操作都会导致页面刷新，因此我只使用jQuery查找具有.collapsible类的所有元素，并按此方式进行设置。

修改

我正在使用Backbone.Marionette.CompositeView来获取这些特定视图，如果这有帮助的话。

Answer 1

我在我的项目中通过将这些功能提取到mixins中做了类似的事情。在Backbone中实现mixins有不同的方法。看一看here或here

Answer 2

您可以创建从Marionettes compositeView扩展的父视图，并在那里添加您的公共功能，并让您的项目视图从此父视图扩展。

var CollapsibleView = Backbone.Marionette.CompositeView.extends({
   variable1: 1,
   var2: true,
   initialize : function() {
      // your code here
   },
   helperfunction : function () {
     // other helpful function
   }

});

var MySpecificView = CollapsibleView.extends({
mySpecificFunction : function () {
 // some specificView functionality
}


});

var myProjectView= new MySpecifcView();

 myProjectView.helperfunction(); /// function from the parent
 myProjectView.mySpecificFunction();  /// function from the specificView
                                            /// you also have the functionality added on the initialization of the collpasibleView

如何在每个视图上运行相同的设置功能？

2 个答案: