0

我是backbone.js 和require.js 的新手。我决定使用这个样板。我想连接两个视图,例如经典 html 页面中的链接单击。所以第一个视图的代码是:

    // View.js
define(["jquery", "backbone", "models/Model", "text!templates/heading.html"],
    function($, Backbone, Model, template){
        var View = Backbone.View.extend({
            // The DOM Element associated with this view
            el: ".example",
            // View constructor
            initialize: function() {
                // Calls the view's render method
                this.render();
            },
            // View Event Handlers
            events: {

            },
            // Renders the view's template to the UI
            render: function() {
                // Setting the view's template property using the Underscore template method
                this.template = _.template(template, {});
                // Dynamically updates the UI with the view's template
                this.$el.html(this.template);
                // Maintains chainability
                return this;
            }
        });
        // Returns the View class
        return View;
    }
);

HTML 模板:

<!-- HTML Template -->
<h3>My first backbone app</h3>
<a href="#next">NEXT PAGE</a>

最后是路由器:

define(["jquery", "backbone", "models/Model", "views/View", "collections/Collection"],
    function($, Backbone, Model, View, Collection) {
        var DesktopRouter = Backbone.Router.extend({
            initialize: function() {
                // Tells Backbone to start watching for hashchange events
                Backbone.history.start();
            },
            // All of your Backbone Routes (add more)
            routes: {
                // When there is no hash on the url, the home method is called
                "": "index",
                "next": "next"
            },
            index: function() {
                // Instantiates a new view which will render the header text to the page
                new View();
            },
            next: function() {
                // Instantiates next view
                new NextView();
            }
        });
        // Returns the DesktopRouter class
        return DesktopRouter;
    }
);

所以我的问题是如何将定义视图 NextView 的代码放入文件 View.js 中?谢谢你的帮助。

4

1 回答 1

0

最简单的方法是定义一个非常简单的事件聚合器。

首先为事件聚合器创建以下对象:

define( function ( require ) {
    'user strict';

    var _ = require( 'underscore' ),
        Backbone = require( 'backbone' );

    return _.extend({}, Backbone.Events);
});

订阅和发布事件如下:

Events.trigger( 'video:closeModal' );
Events.on( 'video:closeModal', this.stopVideo );

我只是从我们的代码库中抓取了这个,所以如果您需要更多说明,请告诉我。

于 2013-06-06T18:29:22.087 回答