javascript - 如何构建基于 Backbone.View 的插件，以便可以单独扩展其嵌套 View ？

Question

我正在设计一个通用对象浏览器插件，其功能类似于 OS X 的列 View 中的 Finder。我已将界面分为几个嵌套 View 、浏览器、列和对象。

我将在浏览器 View 、对象 View 和列 View 可能需要也可能不需要自定义的几种场景中使用此插件。有时，对象是文件和文件夹。

This is OS X's Finder in column view in case you don't know what it looks like.

目前我正在使用 RequireJS 来传递依赖项，但是为了简单地继承和扩展 ObjectView，我必须替换整个堆栈。

是否有更好的结构可以扩展插件但只能扩展其一部分？

浏览器 View .js

var BrowserView = Backbone.View.extend({

    open: function () {
        var collectionView = new CollectionView( {collection: objects} );
    }

});

CollectionView.js

var CollectionView = Backbone.View.extend({

    render: function () {

        this.collection.each( function (object) {
            var objectView = new ObjectView( {model: objects} );

            objectView.bind('click', this.select, this);

            this.container.append( objectView.el );

            objectView.render();

            this.objectViews.push(objectView);
        }, this );

    },

});

ObjectView.js

var ObjectView = Backbone.View.extend({

});

Answer 1

我会将这些 View 放在同一个模块中。

模块的目的 - 无论您使用 RequireJS 还是只是普通的旧 JavaScript 模块 - 都是为了特定目的封装一组相关的对象和函数。在这种情况下，您的目的是 Finder View 。

通过将所有相关对象保存在同一个文件中，您可以更自由、更灵活地使这些对象协同工作。

<小时/>

作为旁注，但与您正在做的事情相关，您也许能够从我的 Backbone.Marionette 插件的“CompositeView”中获得一些关于如何实现这项工作的想法。我之前已经用它构建了文件夹和文件的分层 TreeView ，并且使用它构建 Finder 的列 View 也相当容易。

请注意，我并不是建议您需要使用我的插件。相反，我认为这可能有助于弄清楚您想要如何构建代码。

我有一篇博客文章在这里讨论它:http://lostechies.com/derickbailey/2012/04/05/composite-views-tree-structures-tables-and-more/

您可以在此处找到代码和文档:https://github.com/derickbailey/backbone.marionette

复合 View 的带注释的源代码在这里:http://derickbailey.github.com/backbone.marionette/docs/backbone.marionette.html#section-26