Question

我一直在关注本教程：http://backbonetutorials.com/organizing-backbone-using-modules/

错误发生在home.js（Model）的第7行。我做错了什么???

main.js

// js/main.js

require.config ({
    paths: {
        // Include needed files.
        jquery: '//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min',
        underscore: '//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.6.0/underscore-min',
        backbone: 'libs/backbone/backbone.min'
    }
});

require([
    // Load app module and pass it
    // to the definition function.
    'app',
], function(App) {
    App.initialize();
})

app.js

// js/app.js

define ([
    'jquery',
    'underscore',
    'backbone',
    'router' // Request router.js
], function($, _, Backbone, Router) {
    var initialize = function() {
        Router.initialize();
    }
    return {
        initialize: initialize
    };
})

router.js

// js/router.js

define ([
    'jquery',
    'underscore',
    'backbone',
    'views/home'
], function($, _, Backbone, HomeView) {
    var AppRouter = Backbone.Router.extend({
        routes: {
            '': 'showHome'
        }
    });

    var initialize = function() {
        var app_router = new AppRouter;
        app_router.on('showHome', function() {
            var homeView = new HomeView;
            homeView.render();
        });
        Backbone.history.start();
    };

    return {
        initialize: initialize
    };
})

home.js（查看）

// js/views/home.js

define ([
    'jquery',
    'underscore',
    'backbone',
    'collections/home',
    'text!/templates/home.html' // Use Require.js text plugin to load HTML file.
], function($, _, Backbone, HomeCollection, homeTemplate) {
    var HomeView = Backbone.View.extend({
        el: $('#home'),
        initialize: function() {
            this.collection = new HomeCollection();
            this.collection.add({name: "Ginger Kid"});

            var compiledTemplate = _.template(homeTemplate, {home: this.collection.models});

            // Append our compiled template to this Views "el".
            this.$el.append(compiledTemplate);
        }
    });

    return HomeView;
})

home.js（模特）

// models/home.js

define ([
    'underscore',
    'backbone'
], function($, _, Backbone) {
    var HomeModel = Backbone.Model.extend({
        defaults: {
            name: "Bob Smith"
        }
    });

    return HomeModel;
})

home.js（收藏）

// collections/home.js

define ([
    'underscore',
    'backbone',
    'models/home'
], function($, _, Backbone, HomeModel) {
    var HomeCollection = Backbone.Collection.extend({
        model: HomeModel
    });

    return HomeCollection;
})

Answer 1

您的家庭收藏中的定义是错误的。

define ([
    'underscore',
    'backbone',
    'models/home'
], function($, _, Backbone, HomeModel) {

改为（你有一个$但是没有＆＃39; jquery＆＃39;：

define ([
    'backbone',
    'models/home'
], function(Backbone, HomeModel) {

请注意，每次都不需要包含下划线和jQuery，除非您确实在该文件中使用它们（以_.或$.开头）。因此，您可以删除其他文件中的下划线和jquery定义，直到您实际使用它们为止。请参阅下面关于确保加载顺序的说明。

你的model.js有同样的问题：

define ([
    'underscore',
    'backbone'
], function($, _, Backbone) {

改为（你有一个$但是没有＆＃39; jquery＆＃39;：

define ([
    'backbone'
], function(Backbone) {

将此添加到main.js中的require配置中，因为它确保首先加载jquery和下划线，说它们是Backbone的依赖项。

shim: {
    backbone: {
        deps: [
            'underscore',
            'jquery'
        ],
        exports: 'Backbone'
    }
}

Backbone.js - 无法读取属性＆＃39;模型＆＃39;未定义的

1 个答案: